공구마켓 - 회원가입, 로그인 (01.13 - 01.16)

 

기획이 끝나고, 월요일 개발 전에

디자인을 끝내야 한다.

바쁘다 바빠 현대사회..

↓

2022. 01. 13 (수) - UI/UX 조사

기획자님께 전달받은 내용

---

커뮤니티 사이트나 회원가입 시 위치 요청 사이트에서 (pc & mobile 버전 둘 다)
아래 두 종류의 UI/UX 파악 부탁드려 봅니다.

1. 메인 페이지 구조
2. 회원 가입 (위치를 받아야 하기 때문에 회원 가입 시 다른 서비스들은 어떤 구조로 현재 위치를 요청하는지 파악 필요)

---

---

2022. 01. 14 (목) - 기획, 디자인 회의

< 반성의 날 >

 

UX, 즉 사용자 경험에 대해서는 무지한 나는 무작정 보이는 데만 집중한 예쁜 디자인만 찾았다. 

찾은 레퍼런스들을 보면서 회의를 했는데 '이유도 없이 무작정 모았구나'라고 불현듯이 깨달았다.

참고자료를 많이 찾았지만, 기획자님이 "왜요?"라고 물으실 때마다 이유를 대답하지 못했다.(속상)

UX에 대해 공부를 열심히 해야겠구나 생각하는 계기가 되었고 구글링을 하고 UX와 관련된 영상과 책을 찾았다.

그리고 기획자님께서 보내주신 링크들을 참고하였다.

재밌게 읽은 디자이너 브런치 공유드려요! 나중에 한 번 읽어보세요.
https://brunch.co.kr/@6om/14

아래 두개 아티클 봐주세요 ~
https://uxplanet.org/ux-login-register-and-password-the-ultimate-design-guide-f18b1932ee84
https://brunch.co.kr/@dalgudot/101

감사합니다....이 은혜를 어찌..

 

 

다시 사용자 관점에서 분석해보자!

what 무엇을?
회원가입 도중에 이탈하지 않게

why 왜 이탈하는가?
내가 이미 아는 정보라 지루해서
입력할 필드가 많아서
단계가 너무 길어서
언제까지 입력해야할지 몰라서 (끝을 몰라서)

how 어떻게?
입력단계를 짧게
한 페이지에 다 넣기 → 입력할 정보를 한눈에 볼 수 있음
볼렛을 넣어 단계를 알려주기 → 언제 끝날지 알 수 있음

 

회원가입을 한 페이지에 다 넣기로 결론

---

2022. 01. 15 (토) ~ 2022. 01. 16 (일) - 드래프트 시안 회의

시안 제작 시작!

 

1번 방식

큰 pc화면의 경우 문제가 없겠지만

작은 mobile화면일 경우에는 비좁아 보일 수 있음

 

 

2번 방식

1번 방식의 문제점은 해결되지만

사용자 관점에서 보았을 때,

textarea 안에 이미 "이메일을 입력해주세요"라고 쓰여있는데

굳이 이메일이라고 알려줄 필요가 있을까?

↓

해결!

 

---

 

근처에 있는 사람들과의 공동구매를 하는 서비스다 보니까

회원가입시 위치정보를 받는다.

위치입력칸을 클릭시 노출형태는 팝업으로 이루어지게 디자인했다.

 

로그인도 메인의 상단 "로그인"을 클릭시

팝업형태로 노출되게 디자인하였다.

 

+

회원가입시 약관동의 부분을 만들어야 하는데

여쭤봤더니 추후에 제작할 예정이라 하셔서

notion 백로그란에 기입해두었다!

 

 

이렇게 회원가입, 로그인 부분이 완성되었다.

회원가입

로그인

 

---

아 그리고 +추가로

당연하지만 놀랐던 건..

기획자님이 쓰신 기획서의 일부분

 

내가 지금까지 디자인해왔던 것들은

디자인만을 신경을 쓴 메인페이지

+

대략의 플로우만 보이는 회원가입 1페이지, 로그인 1페이지, ~~ 1페이지 ...등

큰 틀만 잡는 것이었다.

 

하지만 프로젝트를 하면서

'나 지금까지 뭐 해온 걸까..'

머리 텅 한 대 맞은 기분이였다..

회원가입만 16페이지다..

pc와mobile 합치면 32페이지..

 

 

왜냐하면?

예외처리의 작업을 해야하기 때문이다.

예를들어?

 

 

ex_회원가입페이지 - 이메일 -이미 존재하는 이메일일 경우
ex_회원가입페이지 - 이메일 - 입력하지 않고 다음 입력칸으로 넘어갔을 경우
ex_회원가입페이지 - 이메일 - 잘못된 이메일 형식일 경우
ex_회원가입페이지 - 이메일 - 위 조건에 만족했을 경우

 

 

와 같이...

이메일 뿐만 아니라,

비밀번호, 비밀번호 재확인, 닉네임, 위치

예외처리 작업할 게 진짜 많다.

뭐랄까.. 당연한 건 줄 알았다.

예외처리는 코딩(?)으로 알아서 하는 줄..(무식)

다 디자인해야 하는구나...(당연한 말)

신경쓸 게 정말 많구나..(당연한 말)

 

당연한 건데.. 나는 지금까지 무식한 디자인만 해왔던 게 아닐까?

uiux는 어렵고 앎은 끝이 없다.

더 열심히 해야지!

나.. 성장하네..