🦁_21.12.21 TIL

21년 12월 21일

📝 웹 서비스 개발 기획

기획을 하기 전 해야하는 질문

• 왜 웹 서비스를 만드는가?
• 핵심 요소는 무엇인가?
• 누가, 어떤 기기를 가지고 이 홈페이지를 방문하는가?
• 어떤 기능을 제공하는가?

📎 왜 홈페이지 기획을 하는가?

• 시행착오를 줄이기 위해
• 원하는 결과물을 잘 구상하기 위해

📎 무엇을 이용해서 기획 하는가?

규모에 따라 사용하는 툴이 다름 (* 소규모 툴 기준으로 설명)

• 정보 구조 설계(I.A.)
• 화면설계(스토리보드)
• 정보구조설계 Information Architecture
  • 웹사이트의 정보(메뉴구조)를 단계별로 정리한 문서
  • 웹사이트 사이트 맵 검색결과
• 기능목록 : 홈페이지를 구성하고 있는 메뉴와 기능 목록
  
  [블록체인으로 구현하는 투표 시스템 - Jeju BlockChain Vote]

📎 마인드맵(FREEMIND)

마인드 마이스터

📎 화면설계(Kakao Oven, Figma)

• 보통 프로젝트를 할 때 디자이너, 기획자, 개발자와 같이 다양한 사람들의 참여로 이루어진다. 이때 화면 설계는 아이디어 발안자가 아닌 다른 사람들이 작업을 이해하고 아이디어를 소통하는데 중요한 역할을 한다
  => 화면설계는 프로젝트의 청사진이자 목적지
• 만약, 화면설계를 하지 않은 채 프로젝트를 진행한다면?
  => 결과는 아래 사진 참고
  

[출처 : http://blog.naver.com/PostView.nhn?blogId=yingbbang&logNo=221473198909&from=search&redirect=Log&widgetTypeCall=true&directAccess=false]

• 스토리보드
  

• 와이어프레임
  

• 프로토타입
  

소통은 아무리 강조해도 지나치지 않다!
작업이 어느정도 마무리 된 다음에 소통을 하는 것이 아니라 끊임없이 중간과정을 지나치다 싶을 정도로 소통해서 서로의 의도를 정확히 반영하려는 노력이 필요하다.

카카오 오븐

• 프로토타입 툴
• 예시
  • 제주카페찾기 관리자 사이트
  • 영화정보 사이트

Figma

• 웹 기반인 벡터 그래픽 편집기 및 프로토타이핑 도구
• 실시간 협업에 중점을 두고 사용자 인터페이스 및 사용자 경험 디자인에서의 사용에 중점을 둠
• 출처 : https://en.wikipedia.org/wiki/Figma_(software)

---

📝 자료구조 및 알고리즘

📎 2019 카카오 신입 공채 1차 코딩 테스트 문제

---

📝 정규표현식

실습 환경 조성 : 샘플 사이트

---

마무리

• 오늘 배운거 프로젝트에 적용해야겠다 히히히히
• 피곤함이 쌓여있는건지 자꾸 머리박고 자고 있어서 깜짝 놀랬는데요 하하하
  => 그래도 한 10분씩 나눠서 잔거여서 괜찮은거 같기도 하고 아닌거 같기도 하고...