오늘부터 실습 프로젝트로 nuii 회사의 홈페이지 제작 업무를 시작하였다. 더불어 네이버 오디오 페이지 실습을 진행하였다.
1.팀별 프로젝트 진행 상황 및 본인 업무 팀장과 팀원을 뽑았다. 미팅 일정을 잡고 업체와 연락하는 과정을 통해 어떤 부분에 준비가 필요할지 팀에서 논의중이다. 업체에 연락을 하고 명함과 기본 정보를 알게 되었다. 아직 역할은 나누지 않았다.
2. 오늘 강의를 통해 프로젝트에 적용한 부분 기획서를 받아보아야 알겠지만, 홈페이지를 제작하는데에 기업의 요구를 어느정도 적용할 수 있을지 생각해 보았다. 지금까지 배운 강의의 내용을 토대로 활용해보아야 할 것 같다. 나만의 생각이지만, 오늘 배운 네이버 오디오 강의의 메인 부분과 같이 홈페이지의 메인을 구성해 보는 것이 어떨까 싶다.
3. 어려웠던 점과 해결방법 팀 프로젝트를 처음으로 진행하는데에 있어 비대면으로 인한 소통이 익숙하지 않았고, 관련 내용을 잘 알고 있는 사람이 없어 서로가 배운 내용을 토대로 앞으로 얘기해 나가야 할 것 같다. 업체와 연락하는 것은 팀장님이 잘 진행해 주셨다. 대면으로 미팅을 나갈 예정인데 그 부분이 걱정된다.
강의에서는 네이버 오디오 페이지 헤더 영역을 작업했는데, index페이지에 오디오 페이지를 연결한 다음 header에 컨테이너와 그 안에 오디오 네비 레프트와 라이트 영역을 나누어 작업하였다. 레프트영역에는 로고와 ul li로 카테고리를 넣고 라이트영역은 서치랩과 프로필랩을 만들어 공간을 설정했다. css에서 컨테이너와 플렉스에 적용할 내용을 플렉스박스 헬프 사이트를 참고하여 적고 헤더 영역은 포지션을 픽스드로 설정하였다. 백그라운드 컬러는 흰색으로, 보더 바텀을 넣고 z인덱스를 최대치로 키웠다.
레프트 전체 영역의 width를 설정하고 로고의 폰트를 설정했다. ul태그의 패딩탑을 넣고 li a태그의 디스플레이를 블럭으로 설정하여 패딩 값을 넣었다. li a의 스팬태그에 포지션을 렐러티브로 하고 스팬 애프터로 홈 하단에 기호를 넣어주었다. 위치는 레프트, 라이트로 조정했다. 라이트 영역의 width를 설정하고 서치랩의 크기를 설정했다. 아이콘 영역의 색상을 넣고 인풋은 아이콘 서치영역을 뺀 만큼 width값을 넣었다. 포커스된 부분의 아웃라인을 없애고 프로필 이미지와 로그인 버튼의 공간과 폰트를 설정하고 작업을 마쳤다.
4. 아쉬웠던 점 업체와 소통하고 기획을 해가는 과정을 자체적으로 하는 것이 아니라 프로그램 자체에서 연결해 주었다면 훨씬 매끄럽게 진행이 되었을 것이라 생각되었다. 이전에 비슷한 프로젝트가 있었다면 그 진행 과정을 보여준다거나, 업체와 컨텍을 하는것에 팀즈나 메일과 같은 형식으로 연결되었다면 좀 더 수월하게 진행이 되고 업체 쪽에서도 신뢰도가 높아지지 않았을까 싶다.
