뷰를 결정 짓기전에, 우선 쿠팡에 방문하여
소팡에 쓰일 레이아웃들을 살펴봤다.
개발에 집중된 프로젝트이다보니 코드에 대한 경험과 완성도를 우선순위로 결정했고,
디자인과 세부화면/추가화면 등에 자칫 욕심을 부리거나 화려해지지않도록 다스려가며 벤치마킹/기획 했던것같다.
COUPANG
쿠팡은 로켓배송
www.coupang.com
쓰일 화면들을 골라내고
쿠팡의 소스들을 일부 다운받아 css가 깨지지않도록 일부 수정을 한 뒤,
조금씩 편집을 하고 여러 코드와 레이아웃들을 감소화하며 소팡의 무드를 잡아가기로 했다.
무드를 잡아보기로한 본래 목적에만 사용되고 버려질 코드임을 이해하며
우선 디자인에 영향을 주는 이미지들을 모두 placeholder 이미지를 활용하여 간섭이 없도록 제한하고
코드또한 정리하거나 분리하지않고 노력하지않았다
https://standout.tistory.com/217
빈이미지 via.placeholder.com
기본형 응용형: 가로x세로, 색코드, text=다음에 텍스트를 입력하면 끝. * 샘플 txt는 다음을 이용한다. https://www.lipsum.com/ Lorem Ipsum - All the facts - Lipsum generator What is Lorem Ipsum? Lorem Ipsum is simply dummy tex
standout.tistory.com
로그인/회원가입 페이지를 구별하고
메인페이지를 간소화하고 fontawesome을 적용했다.
https://standout.tistory.com/313
Fontawesome 1,609개의 무료 아이콘
1,609 Free(무료) Icons , 7,865 Pro(유료) Icons 무료로도 충분한 디자인이 가능하다. 메일입력으로 간단히 아래의 코드를 얻을 수있다. https://fontawesome.com/start Font Awesome The world’s most popular and easiest to use
standout.tistory.com
리스트페이지와 상세페이지와
마이페이지의 무드도 잡아본 뒤,
위의 모든 화면들을 우선 캡쳐하여 사용될 form, btn, icon, txt등을 파악했다.
'Portfolio > sopang' 카테고리의 다른 글
| sopang 기획 - 기획서 Excel - 기능 (0) | 2023.04.02 |
|---|---|
| sopang 기획 - 기획서 Excel - views 뷰 레이아웃2 (0) | 2023.04.02 |
| sopang 기획 - 기획서 Excel - sitemap 사이트맵 (0) | 2023.04.02 |
| sopang 기획 - 브랜드 (0) | 2023.04.02 |
| sopang 기획 - 기획서 Excel - Tool/FrameWokr/DB (0) | 2023.04.02 |
