본문 바로가기

웹 디자인

[**소프트 재직 당시 작업물] 모바일 & 모바일 웹 UI&UX 디자인

2015. 09 ~ 2016. 03

2015년~2016년 **소프트 재직 당시 담당한 자사 상용 어플리케이션 ㅈ앱(현 홍***, 이하부터는 재직 당시 명칭을 줄여서 표기하겠습니다)의 UI&UX 디자인입니다. 

네비게이션 펼침 화면 - 전단지 만들기 버튼 추가

2015년도에 추가한 네비게이션 버튼 아이콘입니다. 기존에는 어플리케이션의 메인 화면 맨 밑에만 존재했던 버튼을 메인 네비게이션에 추가하게 되었습니다. 

(좌) 기존 어플리케이션 메인 화면 / (우) 메인 화면 리뉴얼 시안

2016년 3월에 제작한 ㅈ앱 어플리케이션 메인 화면 리뉴얼 디자인입니다. 컨텐츠가 많아지면서 어플리케이션 메인 화면의 리뉴얼을 요청받아 제작했습니다. 당시 시안 제작후 어플리케이션에 적용된 이미지는 보관하고 있지 않아, 제작했던 시안 이미지로 대체하였습니다. 퇴사 직전 제작했지만, 이후로도 약 1년간은 해당 디자인으로 서비스하였던 것으로 알고 있습니다.

참고 영상 : https://youtu.be/dfb9Yt1l3zM?t=9

참고 영상에서 ㅈ앱의 메인 컬러 및 명칭이 변경된 것을 제외하고는, 제가 디자인 한 UI를 유지하고 있었음을 확인할 수 있습니다.

전단지 만들기 - (좌) 초기 UI / (중) 2015. 12월 중순 이전까지 적용된 UI / (우) 2015. 12월 중순 이후부터 적용 중인 UI 시안

입사 직후의 초기 ㅈ앱 '만들기' 화면입니다. 입사 후 (중)의 UI로 1차 변경 하였고, 12월 중순 이후부터 (우)의 UI로 리뉴얼 하였습니다. 현재도 아이콘의 일부 모양이나, 상술한 메인 컬러 외에는 (우)의 큰 틀에서 벗어나지 않습니다.

현재(2019. 06) 서비스 중인 ㅈ앱의 전단지 만들기 화면입니다.

위 화면에서 1번 항목 6개 아이콘들의 큰 틀은 제가 제공한 것으로, 기존의 상하가 둥그런 모양에서 위쪽만 뾰족하게 바뀌고, 테두리가 사라진 점과 세부 폰트 등을 제외하고는 원형에 가깝게 유지 중입니다.

ㅈ앱 모바일 웹

2016년 초에 기존 ㅈ앱 공식 홈페이지를 리뉴얼한 ㅈ앱 모바일 웹입니다. 보시는 이미지는 2019년 6월 현재 적용중인 이미지입니다. ㅈ앱 모바일 웹은, 어플리케이션 설치를 원하지 않거나 PC에서 사용하기를 원하는 사용자를 위해 웹에서도 어플리케이션과 똑같이 작동하도록 설계되었기 때문에 위와 같이 디자인되었습니다.

마이 페이지 - (좌) 초기 UI / (중) 리뉴얼 후 UI / (우) 현재(16.06) 적용중인 UI

'만들기' UI 변경 시기 때 같이 리뉴얼된 '마이 페이지'입니다. 좀 더 과감하게 변경하고자 했으나, 회의 결과 기존 UI에서 많이 벗어나지 않도록 결정되어 (중)과 같이 리뉴얼 되었습니다. 현재도 (중)의 뼈대는 유지하며 변화되었음을 확인하실 수 있습니다.   

 

 

사용한 툴 : Adobe Photoshop, Illustrator