내일배움캠프UXUI

[UX/UI 사전캠프] 3주차 4일 팀 미션 - 자주 사용하는 웹 서비스 개선 + WIL

서란(UXUI_4기) 2024. 5. 10. 23:58

[미션] 자주 사용하는 웹 서비스 개선

1. 웹 서비스 선정

  1. 웹 서비스 : 크티 CTEE
  2. 선정 이유 : 디지털 컨텐츠를 판매하는 플랫폼인데 수요보다 공급이 많은 상태인 것 같아서 아쉬움.
  3. 서비스 소개 : 다양한 분야의 크리에이터들을 위한 수익창출 플랫폼

2. UI/UX 디자인 분석

  1. 메인 화면 구성 :

    1. 헤더 왼쪽 - 로고, 내비게이션(크티 가이드, 블로그, 둘러보기)
    2. 헤더 오른쪽 - 검색, 장바구니, 알림, 로그인(로그인 시 프로필), 내 플레이스
    3. 화면 오른쪽 아래 - 챗봇
  1. 클릭 시 동작 :
    1. 로고 클릭 → 메인 페이지로 이동
    2. 내비게이션
      1. 크티 가이드 클릭 → 크티의 노션 페이지새 창으로 켜짐.
      2. 블로그 클릭 → 크티 매거진 페이지로 이동함.
      3. 둘러보기 클릭 → 크티 스토어 메인 페이지로 이동함.
    3. 검색 클릭 → 상단 바 전체가 검색창으로 바뀌며, 최근 검색어가 body를 덮음. (화면을 다 덮는 모달방식일 듯)
    4. 장바구니 클릭 →
      1. 로그인 한 상태 → 모달창으로 장바구니 내역을 보여줌.
      2. 로그인 하지 않은 상태 → 로그인 창으로 이동
    5. 알림 클릭 →
      1. 로그인 한 상태 → 알림 페이지로 이동
      2. 로그인 하지 않은 상태 → 로그인 창으로 이동
    6. 로그인/프로필 클릭 →
      1. 로그인 버튼 클릭 : 로그인 창으로 이동
      2. 로그인 상태의 프로필 사진 클릭 → 프로필 수정, 주문내역, 참여내역, 후원내역, 소식받기(팔로우) 창으로 이동할 수 있는 버튼과 로그아웃 버튼이 있는 드롭다운 메뉴가 밑으로 펼쳐짐.
    7. 내 플레이스 클릭 → 내 플레이스(판매 홈페이지)로 이동(크리에이터 미등록시 크리에이터 가입페이지로 이동)
    8. 챗봇 버튼 클릭 → 챗봇창이 팝업
  2. 인상 깊은 UI/UX와 이유
    1. 디자인 요소들폰트크기 : 반응형 웹 페이지라 모바일에 최적화시킨 것 같다. 웹에서 보기엔 너무 큼직큼직하고 한눈에 들어오는 정보가 적다.
    2. 메인 페이지의 노출 정보 : 크리에이터(판매자)들에게 컨텐츠를 이 플랫폼에서 팔라고 어필하고 있다. 소비자에게도 ‘크리에이터가 쉽게 될 수 있으니 크리에이터(판매자)로 등록하라’고 어필하고 있다.
    3. 블로그 : 나만의 블로그를 만들어서 포스팅할 수 있는 건가 싶어서 클릭해 보니 크티 홍보 매거진이었다. 작성/발행자는 오직 크티.

3. 개선 아이디어

  1. 메인 화면 노출 정보 수정
    • 개선할 점 : 판매자에게만 우리 사이트를 이용해 달라고 어필하고 있다.
    • 개선 아이디어 :
      1. 둘러보기 탭에 판매하는 인기 아이템을 홈 화면에 가져온다.
      2. 윗부분에 크리에이터에게 어필하는 디자인 요소를 다 없애고 메인 한 섹션정도만 남기고 스크롤을 반 이상 내렸을 때 나오는 ‘크티에서 크리에이터들이 할 수 있는 것/하고 있는 것’을 위로 올린다.
  2. 상단 왼쪽 내비게이션 명칭/순서 수정
    • 개선할 점 : 사용자에게 혼돈을 주는 단어를 사용했다.
    • 개선 아이디어 :
      1. 크티 가이드는 순서를 맨 뒤로 보내거나 챗 봇이 있으니 챗 봇에게 역할을 넘긴다.
      2. 블로그는 명칭을 ‘크티 매거진/소식’으로 바꾼다.
      3. 둘러보기는 명칭을 ‘스토어/콘텐츠 스토어’로 바꾸고 순서를 맨 앞으로 바꾼다.

WIL (Weekly I Learn)

  • 일주일 동안 한 일 :
    • PPT보다 쉬운 피그마 4주 차 강의를 모두 들었다. (숙제 아직 못함;;ㅋ)
    • 팀 스터디로 UXUI 디자인 아티클을 분석했다.
    • 웹 서비스를 선정하여 클론 디자인을 진행했다.
    • 웹 서비스를 선정하여 메인 화면 구성을 분석하고 개선점을 찾아 해결 아이디어를 도출했다.
    • 블로그 글을 썼다.
  • 나의 생각 :
    • 아티클 분석하는 팀스터디는 이번에 처음으로 아티클을 “각자” 정하고 “각자”분석해서 공유해 봤는데 짧은 시간 안에 5개의 아티클을 분석한 느낌이라 가성비 짱이라고 생각했다(ㅋㅋ)
    • 클론 디자인은 하나의 웹 서비스를 정하고 5명의 팀원이 페이지를 나눠서 작업했는데, 원본이 존재하는 화면을 따라 하는 건데도 디자인하는 방식으로 팀원들 각자의 개성이 드러나는 것 같아 흥미로웠다.
    • 웹 서비스 선정하고 개선하는 팀 과제는 팀원들이 각자 다른 웹 서비스를 고르고 분석&개선했는데 팀원들의 개선 아이디어를 읽고 나는 어떤 아이디어를 낼 수 있는지 생각해 볼 수 있는 시간이 있다면… 재밌겠다 (시간 없어서 팀원들꺼 확인 못함ㅜㅜ)
  • 배운 것, 얻은 것 :
    • 네이버 웹툰 웹 페이지를 클론 디자인 해본 경험
    • 개선이 필요한 웹서비스를 찾아보고 분석하고 개선점과 해결방법까지 찾아보는 경험
  • 다음 일주일은 :
    • 시간이 안 나서 컴포넌트 아직도 다 못했다… 다음 주엔 꼭… 다 정리하고 만들어보기를…! 적어도 한 번쯤은 정독하기를…!!!
    • 다음 주 팀 스터디와 과제는 앱이다… 이번 웹이 생각보다 더 시간이 걸리고 복잡했어서 걱정이다… 하지만. 이 또한 지나가고 나면. 결과물만이! 나를 반겨줄 것. 😤 마음 단단히 먹고 사전캠프 팀 과제 잘 마무리하자!