본문 바로가기
Daily UI 100

Daily UI :: 001 "Sign Up" UI 디자인하기

by chaen98 2021. 6. 14.
반응형
첫 번째 Design 주제
Sign Up
디자인 힌트
가입과 관련된 가입 페이지, 모달, 양식 또는 앱 화면을 만듭니다.
자원 봉사 행사, 콘테스트 등록, 경품 행사 또는 이미지화 할 수있는 모든 것이 될 수 있습니다.

 


001 가입
001 스타일가이드

 

디자인은 Adobe XD로 750 X 1624 사이즈로 디자인을 했습니다.

시작하기 전에 무슨 컨셉으로 할지, 무슨 어플(페이지)의 로그인, 회원가입을 디자인을 할지 생각을 했습니다.

감이 잡히지 않아서 일단 색상을 먼저 정했습니다.

색상을 큼직하게 BLUE계열이나 PURPLE계열로 잡고 임의의 색상으로 디자인을 시작했습니다.

레이아웃을 잡고 메인화면의 원하는 색상의 이미지를 찾았습니다.

(Unsplash에서 찾았습니다.)

https://unsplash.com/photos/cfKC0UOZHJo

 
Unsplash에 asoggetti의 사진사파이어 안개. Unsplash에서 asoggetti 님의 사진 다운로드

unsplash.com

이미지에서 색상을 추출하여 색상을 정했습니다.

(color.adobe.com에서 사진을 업로드하여 색상을 추출했습니다.)

https://color.adobe.com

 

https://color.adobe.com/ko/create/color-wheel

 

color.adobe.com

아이콘 같은 경우는 구글 머티리얼 아이콘을 사용했습니다.

https://fonts.google.com/icons

 
Google 글꼴훌륭한 타이포그래피를 통해 웹을 더 아름답고, 빠르고, 개방적으로 만들기

fonts.google.com


첫 번째 과제를 마무리하며..

아직 많이 부족해서 벤치마킹을 하는 시간이 길며,

기획부터 차근차근해야 하는데 기획보다는 바로 디자인을 시작한다는 점?

100일 동안 디자인을 하면서 기획하는 습관을 들여야 할 거 같다

아직 디자인 감각이 없어서 많이 부족하고 시간도 많이 걸리지만

포기하지 말고 천천히 꾸준히!!

언제 가는 이에 맞는 보상을 받을 수 있을 거라고 생각한다

 

https://dribbble.com/shots/15843105-First-Daily-UI-Design-001

 

First Daily UI Design #001

The first Daily UI is complete. It's not enough yet, so I extracted the color from the picture.

dribbble.com

 

반응형

댓글