월 14,960원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
[CTA 적용] -Good Case vs Bad Case
안녕하세요, 에릭님 어느덧 강의 수강률 90%까지 도달했습니다. 알려주신 원리 및 Case를 바탕으로 좋은 UX/UI가 무엇인지 계속 고민중입니다. 생각만큼 바로 보이지 않는 것 같아요. 꾸준히 진행하면 괜찮아지겠죠? 남은 기간동안 열심히 해보겠습니다. ======================================= [2차 과제] 원리:CTA 비교 사이트 :(1)탈잉,(2)클래스 101 제공 서비스: 두 서비스 모두 취미,커리어 개발등에대한 온/온프라인 클래스를 중개 및 판매하고있습니다. 사용자 상황: 신청을 희망하는 클래스 결제를 클릭한 상황 결제 상품: 두사이트 모두 신청한 상품의 패키지 상품 판매 1.탈잉-Good - 단일 클래스 신청시 관련 패키지 클래스 상품 안내 - 수강신청이 아닌 '패키지 보기' 강조로 사용자 CTA 유도 - 개별 클래스 외 다른 연관 클래스의 관심있는 사용자의 패키지 보기 클릭을 자극 할수 있음 2.클래스 101-Bad -신사임당 단일 클래스 신청하기 클릭시 패키지 상품 안내 없음 -클래스 101은 탈잉과 달리 인기 강사 중심으로 패키지 상품이 1(인기강사):N(패키지상품)개 존재 -클래스 강사의 패키지 상품이 N개 존재하더라도 리스트 형식으로 보여주는 방법도 고려 가능한 방안 -패키지 상품 판매의 매출 향상을 위해서는 탈잉과 같이 개별 상품 신청시 패키지 상품을 보여주고 사용자 CTA 유도 필요
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
[UX/UI]-Good vs Bad 과제 제출합니다.
안녕하세요,에릭님 사용자 친화적인 UX/UI를 설계하기위해 노력중인 3년차기 기획자입니다. 이번과제로 두 채용(원티드,사람인) 사이트를 비교해봤습니다. 취업사이트에는 2가지 유형(구직자,구인기업) 사용자가 존재하나 구직자 기준으로 좋은 UX/UI를 평가했습니다. ===================================================================== 1.멘탈모델과 컨셉모델 사용자(구직자)가 원하는 멘탈모델: 지원하고싶은 기업을 찾거나 취업에 도움이되는 콘텐츠를 기대 [Bad:사람인] ->요약:전체적으로 메인화면이 자체 상품의 고객인 구인 기업 위주로 사이트 컨셉이 설정되어 아쉬움 ->사람인에서 컨셉모델:기업 상품 판매를 향상하기 위한 페이지 정렬 ->공고 소개시 구직자에게는 노출될 필요성이 낮은 상품의 명칭표시(플레티넘,상품소개..) /(첫 화면만 약 500개기업 노출) ->개선 방향:(1) 첫화면에 표시되는 기업의 수 최소화 (2) 사용자(구직인)이 더 사이트에 오래 머물 수 있도록 도움이 되는 콘텐츠 강조 [Good:원티드] ->요약:메인화면의 구직자 중심의 콘텐츠를 제공하고 있다는 느낌이 듦 >원티드 컨셉모델:구직자에게 도움이되는 개인별 맞춤 공고 및 콘텐츠 제공 ->친절한 마이크로카피와 공고와 콘텐츠 간의 영역 구분 (Wanted 합격예측 성장) 배치가 직관적 ->한 페이지의 표시되는 콘테츠의 양도 많지 않으며,이미지 중심으로 노출되어 정보의 전달력이 효과적 ->원티드 AI 기반으로 지원자의 서류 합격 가능성을 수치료 표현해 ‘입사지원’에대한 CTA 유도 2.일관성 [사람인] ->웹(PC):채용공고 페이지내 상세 검색 조건(지역,경력등)변경시 최싱단으로 스크롤 업 후 변경 가능 ->모바일(IOS):상단 상세검색을 고정해 스크롤 다운시에도상세검색 조건 변경 가능 ->개선방향:웹화면에서도 상세 검색조건을 변경 가능하도록 변경해 웹/모바일에 일관된 경험 제공필요 [원티드] ->웹/모바일과 전체 페이지 구성이 동일 ->웹/앱 모두 스크롤 다운 후에도 상단에 검색 조건을 변경 가능해 사용자 친화적인 UX 제공 글자수세기 / 맞춤법 검사 내용 입력 3.전체 UX/UI 생각[사람인]한 페이지의 제공하는 정보가 많아 강조 되어야 할 정보가 눈에 들어오지 않습니다. 필요한 정보를 찾기 어렵다 보니 페이지에서 이탈률도 높아질 것으로 생각됩니다. 무엇보다 첫 화면에 4~500개가 되는 기업을 표시하는 것은 두 사용자 유형(구인 기업 좋지 않아 보입니다. [원티드] 심플한 IA(홈/탐색/커리어상장)와 적당한 콘텐츠 배치로 정보 확인에대한 직관성이 높았습니다. 서비스의 방향에대한 선택과 집중이 사용자 친화적인 UX환경을 만든것 같습니다. 원티드는 사람인과 달리 스타트업 중심의 채용공고를 집중으로 제공하고 있습니다. . 메인 타깃 연령 층이2~30층이다보니 텍스트가 아닌 이미지 중심으로 정보를 전달하고 콘텐츠 제공 방식 또한 개인 맞춤형으로 제공하고있다는 생각이 들었습니다.
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
출시 전 테스트에서 로우파이나 미드파이 단계에서 테스틀할 사용자는 누구인가요?
안녕하세요 로우파이나 미드파이 단계에서 사용자 경험을 테스트한다고 하셨는데 어떤 사용자를 말씀하신건지 궁금합니다 로우파이나 미드파이 단계에서는 완전한 프로덕트를 만든 상태가 아니기 때문에 프로덕트를 직접 사용하는 소비자들이 아닐거 같다는 예상에 다른 사용자가 있는지 궁금해서 물어봅니다..ㅎㅎ
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
강사님 과제 이메일 보냈습니다! 피드백 부탁드립니다.
강사님 과제 이메일 보냈습니다! 피드백 부탁드립니다.
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
👍🏻 UX, 👎🏻 UX 사례
안녕하세요 - 뉴질랜드에서 UX를 공부하고 있는 웹디자이너 입니다! : ) 좋은 UX 의 예: https://www.supremainc.com/ko/#n 우연으로 찾은 웹사이트인데, UX를 잘 고려했다는 생각이 들었습니다 : ) 1. 행동유도성 첫 배너에서는 왠지 특정한 제품들을 소개해주는데, 슬라이드 버튼의 default state 를 빨간색과 rectangle 로 표시해줘서 클리어하게 슬라이드인것을 알수있어서 바로 넘길수 있었어요. 그리고 이 슬라이드의 배너들을 봄으로써도 이곳이 보안관련 제품을 파는곳임을 학습할수 있었습니다.또 큼지막하고 좋은 visual, 그리고 대조되는 typography 쓴것을 통해 빨리 인식할수 있지 안았나 생각합니다. 2. 정보설계 분류 2번째 섹션 - 중앙 집중형 솔루션, 분산형 솔루션이 큰 카테고리로 나눠지고 tab 으로 나눠진것도 잘 했다고 생각해요. 보기 쉬운 이미지도 플러스도 너무 좋다고 생각합니다! 3번째 섹션 - 건설,데이터센터, 의료, 상업 등을 탭으로 나눔으로써 보안 관련된 제품이 다양한 곳에서 사용되는것과, 어디서 사용되는지 따라 다름을 학습할수 있었습니다. 유저가 자신의 목적에 맞는 category 를 빠르게 읽고 선택할수 있다는점에 잘했다고 생각합니다 main navigation 에서 중요한 네가지만 보이고, hover state로 잘 찾을수있도록 분류를 잘 해놨다고 생각합니다. 그렇게 중요하지않은 페이지들은 footer 에 넣어놓은것도 유저의 main 목적이 빨리 달성될수있고, 방해되지 않도록 돕는다고 생각합니다. 그리고 Footer 에 보면 수많은 페이지들이 있는데, 큼지막한 category 들과 sub category 로 유저들이 원하는 것을 찾을수 있도록 아주 잘 나눴다고 생각합니다. 그리고 전체적으로 폰트사이즈로 대조를 잘 해뒀고, 또 검정과 회색을 적절히 사용해서 보기편하게, 그리고 지문 인식 모듈, 문의를 빨강색으로 함으로써 웹사이트에서 전체적으로 잘 대조 됩니다. 3. ConsistencyConsistency 면에서도 굉장히 잘 고려 한것같았습니다. - Header Banner layout- Title for each section- 아이콘- 색깔- 레이아웃 전체적으로 잘 일관 되있어서 navigate 하는데 아무런 불편함이 없고, 보기 편하다는 느낌을 많이 받았습니다. 고로 무엇을 선택하면 무엇이 나올지 clear 하고 유저 입장에서 다음 행동을 하는데 아무런 막힘이 없을것 같았어요.문의하기,고객지원 section 에서 같은 레이아웃인데 reversed version 으로 한것도 좋았습니다. 또 보통 이런 웹사이트는 눈이 좋지않으시거나, 나이드신분들도 많이 이용하실텐데, 폰트가 전체적으로 커서 이런 분들을 고려한것 같아서 좋았습니다. 안 좋은 UX 의 예: https://www.accesscontrol.co.nz/ 비슷한 류의 웹사이트를 한번 찾아봤습니다. 1. 네비게이션에 너무 뭐가 많아요 맨위에 불필요해 보이는것들 포함한 총 7개가 있고 (전화번호도 넣을필요가 있었을까?), 그리고 그 바로 밑에 6 분류가 또 있습니다! 너무 많은것들이 가까이 함께 있으니까 클리어 하지않고 유저가 원하는것을 단번에 찾기도 어렵고 헷갈려 보입니다. 두번째 네비게이션에의 끝에 Get an estimate 는것도 product 분류에 같이 끼어있는게 이상하고 헷갈리게 할수있는것 같습니다. 2. Consistent 하지않음 레이아웃, spacing, 폰트들이 Consistent 하지않고 섹션타이틀마다 잘 보이지 않습니다. 중간중간 뜬금없이 'Contact form' 이나 'contact us' 폼이 있는것도 오히려 헷갈리게 하는것 같습니다.wording 도 consistent 하지않습니다: 'Contact us for a free quote', 'contact us' 'Get a free quote' 다 같은 링크로 연결되어 있는데, 마치 다른링크게 연결된것처럼 헷갈려서 행동을 막는것 같다. 게다가 웹사이트에 네비게이션에 Get an esimate 가 있는데 또 왼쪽 밑에는 'Get an Instant Estimate' 가 있다. 두가지 다른 페이지로 연결되는것이 참 헷갈리게 한는것 같았습니다. 3. 이상한 분류 먼저 'Primary Solutions' 에서 Health & Safety 가 메인 카테고리로 분류되어 있지만, 메인 두번째 네비게이션에서는 Entry management 안에 속해있다. 이부분도 작을수있지만 잘 고려하지않았다는 느낌이 듭니다.'Browse Our product' 는 좀 쌩뚱맞게 분류된 느낌이구요. 전체적으로 뭐가 뭔지 잘 모르겠는, 일관성의 원리, 행동 유도성의 원리, 정보설계 많은 부분에서도 잘 고려하지 못한것을 많이 느낄수 있었습니다. 그래서 낮은의도와 높은 의도를 가진 유저를 잘 충족하지 못할것 같습니다. 감사합니다 ~~ 제가 보지못한것이나 더 추가될게 있거나 하면 말씀해주시면 너무 감사하겠습니다 ~
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
좋은 UX, 안 좋은 UX 사례
안녕하세요. 평소 자주 사용하는 어플리케이션과 웹사이트 중에서 UX 사례를 찾아 보았습니다. BAD : 29CM 대체적으로 좋은 UX와 UI를 보여주고 있다는 생각이 들지만 상위 카테고리의 페이지가 없다는 점을 안 좋은 UX의 예로 가져왔습니다. 일반적인 편집샵 사이트에서는 여성, 남성 카테고리를 클릭하면 여성 제품 페이지, 남성 제품 페이지로 이동이 가능한데 29CM에서는 여성, 남성 클릭 시 히든 메뉴가 나오고 거기서 의류, 악세서리 등 세부 카테고리를 클릭해야 페이지가 넘어가도록 설정되어 있습니다. 지금은 익숙해졌지만 처음 해당 사이트를 이용했을 때 몇 번씩 시행착오를 겪고 불편했던 기억이 나서 안 좋은 UX 사례로 가져왔는데 여기에 어떤 숨은 의도가 있는 것인지 궁금하기도 합니다. GOOD : HEADSPACE 명상 컨텐츠를 제공하는 HEADSPACE의 어플리케이션을 좋은 UX의 예로 들었습니다. HEADSPACE는 명상이라는 주제를 크게 다섯가지로 나눠 쉽게 접근할 수 있도록 분류하고 있는데 타 어플리케이션과 다른 점은 카테고리의 명칭이 명상의 '종류'보다 명상을 하는 사용자의 '행동'에 초점이 맞춰져 있다는 점입니다. 일반적으로 '음악'으로 표현되는 뮤직 큐레이션 기능을 '집중하기'로, 운동 관련 컨텐츠는 '움직이기'로 표현했는데 직관적이고 일관성 있는 카테고리 명이 사용자가 서비스를 쉽게 이용하는 데 도움을 준다고 생각합니다. 또 고정된 카테고리 각각의 세부페이지도 완전히 동일하게 구성되어 있어 사용자의 접근성과 편안함을 고려했다는 생각이 듭니다.
- 해결됨뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
좋은 UI, 안 좋은 UI 사례
안녕하세요. 도서 사이트 예스24와 리디북스의 UI를 비교해봤습니다. BAD : YES24 먼저 안 좋은 UI의 예로 예스24 사이트를 들 수 있는데요. 상세 페이지 하나에 너무 많은 정보가 나타나는 걸 볼 수 있습니다. 같은 정보가 중복되는 건 물론 4개가 넘는 광고 배너와 이벤트 창, 네비게이션 바의 웹진, 추천도서 등 불필요한 요소가 시각적인 피로를 줍니다. 또 구매 정보와 구매 시 참고사항 (책 정보) 이 함께 있고 각각의 간격도 너무 멀어 산만한 느낌을 줍니다. 가장 혼란스러운 점은 네 개의 CTA 버튼입니다. 색상만 다른 네 개의 버튼이 함께 있어서 어떤 버튼이 메인인지 알기 힘들고 '바로 구매' 와 '원클릭 구매'는 버튼명도 비슷해서 두 개의 기능에 어떤 차이가 있는지 가늠하기 어렵습니다. GOOD : RIDIBOOKS 예스24와 비교했을 때 비교적 정돈된 환경을 보여줍니다. 구매 정보와 책 정보를 뚜렷이 구분해서 묶어놓은 부분이 눈에 띄고 키 컬러를 사용한 메인 버튼이 한 눈에 들어와 사용자가 다음 행동을 이어가는 데 혼란을 주지 않습니다. 과도한 정보없이 인기 책 정도를 네비게이션으로 보여주는 점이 예스24와 다르고, 또 '좋아요' 버튼을 눌렀을 때 바로 피드백이 나타나는 점도 예스24 ('좋아요' 버튼 클릭시 블로그 생성으로 넘어감), 네이버 책 ('좋아요' 버튼의 기능은 하트 색깔 바꾸기 정도, 위시리스트 기능은 사라지고 버튼만 남음) 등의 서비스와 차이를 보이는 부분입니다.
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
오픈소스
안녕하세요 강의를 듣고있는 학생입니다! 어려울법한 강의내용들을 비전공자인 저에게 잘 풀어서 설명해주셔서 감사히 듣고있습니다ㅎㅎ 다름이 아니라 질문이 하나 있는데, 강의에서 말씀하셨던 오픈소스, 툴들이 인터넷에 많이 풀려있다도 하셨는데 혹시 그것들을 모아둔 사이트를 알수있을까요? 디자인에 참고하고싶습니다!
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
좋은 UX 안좋은 UX (2)
강사님 안녕하세요. 한달 전 쯤에 좋은 ux 관련 과제를 올렸던 대학생입니다. 최근에 넷플릭스에서 삭제 버튼이 생겨 강사님이 생각나서 이렇게 글을 작성합니다. 그리고 최근에 관심사가 장애인들에게 편리한 대한 웹과 앱이였는데, 많은 것을 알게 되어 강사님께 공유하고 싶어 이렇게 글을 작성합니다. 강사님께서도 이미 아시는 내용이실 수도 있겠지만, 혹시 다른 분들이 이 글을 보고 많은 아이디어를 생각하거나 도움이 되었으면 좋겠다.. 라는 마음에 글을 남깁니다. 과연 시각장애인들은 어떻게 스마트폰을 사용할까? 라는 생각을 하면서 알아본 것들이 좀 있었습니다. 관련 링크들을 달아드립니다. http://theindigo.co.kr/archives/11540 https://nax.naver.com/index 시각장애인은 쇼핑을 할 때 옷을 골라도 결제를 못하는 경우가 많다고 하네요. 간편결제로 지원되는 곳이 카카오페이, 네이버페이, 페이코, 삼성페이 이렇게 있습니다. 4개의 간편결제 외에는 비밀번호를 누를 때 버튼이라는 말만 반복되서 결제가 안되는 경우도 있다고 합니다. 그리고 배달앱 같은 경우에도 배달의 민족은 음성을 지원하는데, 요기요는 지원을 안합니다. 왓챠랑 넷플릭스를 비교하면 왓챠는 시각장애인을 위해 해설을 읽어주는 기능은 없습니다. 넷플릭스는 시각장애인을 위해 화면 해설을 다 읽어주더라구요. 혹시 궁금하시면 한번 해보셔도 좋을 것 같습니다 ! 현재 사용하시는 핸드폰으로 아이폰 같은 경우 손쉬운사용으로 들어가셔서 보이스오버를 키시면 직접 해보실 수 있습니다. 너무 말이 길어졌네요.. 강사님 코로나 조심하시고 오늘도 좋은 하루 보내시면 좋겠습니다 :)
- 해결됨뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
좋은UX / 안좋은 UX 과제
안녕하세요, 저는 현재 스타트업에서 UI/UX 디자이너로 일하고 있는 신입입니다. 사수가 따로 없어 혼자서 이것저것 하려고 하다보니 많이 부족하기도 하고 UX기초를 다시 정리해보고 싶어서 강의를 듣게 되었습니다. 우선 저는 좋은 UX와 안좋은 UX의 예시를 클래스101 하나의 플랫폼에서 찾았습니다. 클래스101은 인프런과 유사한 플랫폼이라고 볼수 있는데, 취미 위주의 온라인 플랫폼 입니다. 좋은 UX - 웹 / 모바일 우선 웹사이트와 모바일페이지는 전체적으로 깔끔하고 사용하는데도 편리하다고 느꼈습니다. 카테고리도 분류가 잘되어 있어서 필요한 정보를 손쉽게 찾을 수 있었습니다. 취미, 재테크, 커리어 등 카테고리가 잘 나누어져 사용자가 원하는 클래스를 더욱 간편하게 찾아볼수 있도록 설계된것 같습니다. 모바일 페이지도 웹과 전체적으로 유사하게 깔끔하고 편리하게 디자인 된 것같습니다. 한가지 아쉬운점은 하단 탭바 부분에 다른 유용한 버튼을 추가하면 더 좋을 것 같습니다. 안좋은 UX - 애플리케이션 (iOS를 사용중이라 안드로이드는 알지못합니다) 과거 클래스101 애플리케이션 같은경우 앱내에서 클래스 정보도 찾을 수 있었고 결제까지 가능했던것 같은데 최근 리뉴얼이 되면서 앱은 클래스 정보또한 탐색할수 없었고 웹에서 결제 후 강의 시청용으로만 사용이 되는 것 같습니다. 시청또한 웹/모바일 페이지에서 결제 후 바로 시청하는것이 더욱 편리할텐데 굳이 웹에서 결제 후 앱까지 다운을 받아서 시청할 필요가 없는 것 같습니다. 앱스토어의 수수료 정책때문에 변경된것인지는 모르겠지만 사용자의 입장에서는 불편하게 느껴졌습니다. 저 혼자만의 생각일수도 있습니다만 개인적으로는 과거의 앱이 더욱 편리하고 깔끔하게 느껴졌는데 변경이 되어서 조금 아쉬웠습니다. <과거 버전> 퇴근후 조금씩 강의를 듣고 있는데 도움이 많이 되는것 같습니다! 개인적으로 UX를 간단하게 분석해보았는데 부족한 부분이 있으면 알려주시면 감사하겠습니다.
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
ux과제(마켓컬리 vs 프립)
안녕하세요, 저는 이커머스 CRM 마케팅 분야에서 일하고 있는 20대 사회초년생이구요. 직무전환을 위해 이것저것 공부하다가 UX디자이너라는 새로운 꿈을 가지게 되었습니다🙂 UX공부는 디자이너님 강의로 처음 시작하게 되었어요. 좋은 강의 감사드립니다. <좋은 ux와 나쁜 ux 찾기 과제> 업로드합니다. 좋은사례 - '마켓컬리' 마켓컬리를 이용할 때마다 군더더기 없이 깔끔하다는 느낌을 많이 받았습니다. 메인 탭에서 신상품/베스트/알뜰쇼핑 으로 상품을 나눈 점이 좋았습니다. 식품을 살 때 소비자가 크게 고려하는 점을 잘 나누어서 메인탭으로 배치한 느낌이 들었습니다. 특히나 알뜰쇼핑 탭을 따로두어 소비자가 가격대별로 합리적인 상품을 볼 수 있었던 점이 소비자의 구매경험을 더욱 편리하게 해준다는 느낌이였습니다. 컬리는 카테고리 설계가 매우 잘된 앱이라고 생각합니다. 국산/수입상품으로 나눈 점도 합리적이였고 신선식품의 경우 제철식품이 있기 마련인데, 카테고리로 따로 둔 점이 흥미로웠습니다. 개인적인 경험이지만 저는 요리에 관심이 있는데 제철재료를 늘 기억할 수가 없어서 검색을 하고 구매하곤 했습니다. 하지만 컬리에서는 제철음식을 카테고리로 따로두어 구매결정에 시간이 절약되고 편리했습니다. 나쁜사례 - '프립' : 프립은 여가 액티비티 플랫폼입니다. 나쁜 ux사례를 떠올렸을 때 가장 먼저 프립이 떠올랐습니다. 아무래도 스타트업에서 만든 플랫폼이다보니 개선점이 많은 것 같습니다. 사용자 입장에서 경험할 때는 불편해서 화나는 점이 많았는데, UX를 공부하는 입장이 되니 공부할 점이 많아 갑자기 좋아지네요(?) 정보설계 부족 배운 바에 따르면, 정보설계란 카테고리를 잘 나누어 사용자가 서비스에 대해 쉽게 학습할 수 있도록 하는 것인데요. 이 점이 부족하다는 생각을 했습니다. 상단 추천항목을 보시면 '밀키트' 카테고리를 볼 수 있습니다. 그런데 이 밀키트의 상위 카테고리를 찾는데 어려움이 있었습니다. 밀키트가 음식을 조리하는 것이기 때문에 요리 카테고리의 하위 카테고리가 아닐까 생각했는데 상기 이미지를 보시면 밀키트 카테고리 옆에 요리 카테고리가 있는 것을 알 수 있습니다. 그럼 밀키트는 단독 카테고리로 분류되어 있는건가 생각했습니다. 왼쪽 상단의 사이드 카테고리 바를 눌러 전체 카테고리를 확인하였습니다. 그런데 어느 곳에도 밀키트 카테고리는 없었습니다. 알고보니 밀키트 카테고리는 최상단 배움 카테고리 > 언택트 > 밀키트 이 순서로 들어가야 발견할 수 있었습니다. 이 점에서 의문점이 들었습니다. 프립에서 제공하는 강의 대부분은 오프라인 활동입니다. 따라서 밀키트처럼 혼자서도 체험할 수 있는 분야인 '언택트'는 배움 카테고리 안이 아니라 그 자체로 최상위 카테고리에 있는 것이 더 나은 설계라고 생각합니다. 특히나 최근에는 코로나19 여파로 언택트 활동에 대한 수요가 높아졌기 때문에, 배움 카테고리 안이 아니라 단독 카테고리로 만들어서 사용자 유입을 좀 더 용이하게 하는 것이 좋지 않을까 생각했습니다. 2. 정보 제공방식의 통일성 부족 대부분의 앱은 구매 상세정보를 클릭했을 때 보통 배송정보, 결제정보 크게 두 가지 정보가 카테고리화 되어있습니다. 하지만 프립은 결제정보만 눈에 확 들어오는 점이 문제입니다. 배송 기본정보는 '배송 정보'로 카테고리화도 되어있지 않을 뿐더러 마치 앱 하단의 사업자 정보마냥 회색의 작은 글씨로 제공되고 있습니다. 구매자가 최종적으로 구매 후 확인해야 할 중요한 정보이기에 정보제공 방식이 잘못된 것 같습니다. 친절하지 않은 정보제공 제품을 구매하니 사용가능 tab 에 상품이 뜹니다. 그런데 '유효기간' 부분이 의문스러웠습니다. 구매일로부터 7일까지라는 말이 어떤 의미인지 모르겠습니다. (여기저기 찾아봐도 알 수가 없었습니다..) 아마도 프립은 오프라인 체험을 주로 제공하는 플랫폼이기에 체험권을 구매하면 유효기간이 7일인 것 같습니다. 그런데 밀키트 제품같은 택배상품에도 체험권과 동일하게 유효기간을 표기한 의도가 무엇인지 모르겠습니다. 구분이 필요하다고 생각합니다. 저는 두 번째 주문이라 유효기간을 무시할 수 있었는데, 처음 구매를 했을 때는 모르는 정보가 많아서 불안했습니다. 대부분의 소비자들이 이런 감정을 느낄 것 같습니다. 오프라인 체험을 제공하는 프립이지만 코로나19로 인해 밀키트와 같이 언택트로 체험할 수 있는 상품을 판매하는 것이 불가피하다고 생각합니다. 하지만 앱의 모든 tab이 오프라인 코스에 맞추어져 있기때문에 언택트 상품을 구매하는 소비자들은 분명 불편함을 느낄 것이고, 프립에서 언택트 상품을 구매할 이유가 없는 것 같습니다.
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
연봉에 대한 강의 듣고나서...
프린시플로 연봉을 올리셨다고 하셨는데, 그리고 프린시플이 스케치랑 연동되는 걸로 알고 있어요. 그런데 피그마랑 연동 되는지와 추후에 강의 계획있으신가요? 궁금해요.
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
안녕하세요 에릭선생님! 페이스북 페이지를 찾지 못하겠어요ㅠ
ux/ui 공부방이라고 facebook에 검색을 해봐도 나오질 않네요.. 혹시 링크가 있으시다면 답변으로 보내주실 수 있을까요?! 감사합니다ㅠㅠ!
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
문의드립니다.
설명 ppt 공유 해주셨나요?
- 해결됨뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
UI 디자인 원리 - 과제
1) 유사성의 원리 위 네비게이션바 중앙 메인 배너( 강조하고 싶은 제품들) 상위 카테고리 영역 그리고 그 안에 있는 하위 제품들이 하나의 덩어리로 보여졌어요. 2) 근접성의 원리 컨텐츠들 사이에 여백과 함께 각 영역의 컨텐츠들이 가깝게 있어 이 제품을 누르면 해당 제품으로 넘어가겠구나 라는 생각을 했습니다. 3) 와디즈 사이트를 캡쳐한 이유가 이것 때문이기도 했는데요. 예로 휴라스틱 평가 1번째 시스템 상태 가시성 펀딩이 성공인지 실패인지를 사용자들이 한눈에 알아볼 수 있도록 상태 안내를 통해서 표현해줬더라구요. 4) CTA CTA의 경우 제품이 관심이 있어 눌렀을때, 펀딩하기 버튼이 브랜딩컬러로 들어가 눈에띄어서 이 제품이 마음에 들면 펀딩하기 버튼을 누르면 되구나 라는 생각이 들어 사용자로 하여금 다음단계를 어떻게 해야할지 학습시켜 주었습니다. +) 의도치 않았는데 저 하트 아래에 설명부분이 나오면서 안내 해주는 것이 나왔네요. 이건 휴라스틱의 6번째에 해당하는 부분인가요? 인식할 수 있도록 작은 상자를 써준 것 같다는 생각을 했네요. 5) 휴라스틱 평가 - 3번째 사용자 제어 및 자유 실수로 펀딩하기를 의도치 않게 눌렀을 경우 스토리로 다시 돌아 갈 수 있도록 exit 기능을 할 수 있는 버튼을 제공했더라구요. 언제든지 실수로 누른 것을 취소할 수 있는 기능인 것 같아 가져왔습니다.^^ 아쉬웠던 부분 메인페이지 메인 페이지에서 맨 위에 상단바로 이 사이트는 펀딩도할 수 있고 투자도 가능하구나, 스타트업 회사들의 정보도 알려주네? 그리고 더 정보가 궁금하면 더보기로 제공해준게 좋았고 (휴라스틱 8. 심미적이고 미니멀한 디자인) 기본 정보만 보여주고 더 보고싶으면 누를 수 있도록 해준 것이 마음에 들었다. 그다음 메인 배너로 제품을 소개해준거는 좋았는데 투자하는 내용도 넣어주면 어땟을까라는 생각을 했어요. 사용자 중에는 투자하기하는 사람이 한명이라도 있지 않을까 물론 대부분 펀딩하러 들어오겠지만요. 그리고 이프로젝트 어때요? 실시간랭킹 회원님이 좋아할 프로젝트 에서 글자가 차이가 나서 일관성이 보이지 않았는데요. 이게 의도적으로 제품이 아래 짤려서 보이지 않을까봐 일부러 좋아할 프로젝트는 줄였는지 모르겠지만 일관성이 느껴지지는 않았어요. 그리고 근접성으로 사이사이 간격 여백이 조금 좁다고 생각했어요. 안그래도 각각의 설명 정보가 많은데 여백을 조금 더 줘도 되지 않을까? 정보가 많아서 그 예시로 들어주셨던 디씨갤러리 처럼은 아니지만 조금만 더 띄어주면 어떨까 생각했어요. 메인 배너에서 휴라스틱 시스템 상태 가시성이 잘 사용되었네요. 좋아할 프로젝트 추천해줌으로써 인식하게 해줌으로써 제가 봤던 제품들을 바탕으로 추천해주는 부분이 6번에 해당하는 부분이라는 걸 알았습니다. 배운걸로 일단 여기까지는 알았는데.. 부족한 부분있으면 알려주세요!
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
UX 디자인 원리 - 과제
1) 일관성의 원리 11번가(전세계 배송관)의 경우, 위에는 flat한 느낌의 아이콘이면서도 아래 배너있는 곳 부터는 입체적인 느낌이 들어 일관성이 느껴지지 않는다. 그리고 이미지를 보면 어떤 것은 외부에 테두리가 있고 어떤 것은 그림자로 되어있다. 아이템 사진 내에 4개로 제품이 나눠져있는 경우도 있었다. 29cm의 경우, 아이콘의 통일성과 전체적인 컬러 느낌이 블랙과 화이트로 통일성이 느껴져보인다. 이미지의 경우 맨 상단에 대표 3개를 강조해주고 나머지 이미지는 아래에 배치해두어 중간에 얇은 선을 두어 구분이 갔다. 그리고 크기 차이를 주어 위와 아래의 차이를 명확하게 주었다. 그리고 매 사진마다 숫자 깃발? 같은 것을 넣어주어 순서대로 배치했음을 알 수 있다. 2) 행동 유도성의 원리 11번가(전세계 배송관)의 경우, 전체적으로 컬러가 블루색이 비슷한 채도가 너무 많고 어떤 것을 눌러야 할지 모르겠다. 29cm의 경우, 위 상단 바와 왼쪽 메뉴 창에서 네비게이션으로 내가 Best-실시간 클릭을 보고 있구나 알 수 있고 검은색과 회색으로 텍스트에 색상 차이를 주어 클릭했을 때, 진하게 검은색으로 바뀌는 구나 알 수 있게 해줌 그리고 각 제품의 이미지를 크게 배치함으로서 사용자가 클릭할 수 있게 유도 한것 같다고 생각함 3) 대응의 원리 29cm의 경우, 숫자 깃발을 통해 인기 순서대로 사물을 볼 수 있도록 해준다. 그래서 나도 모르게 숫자 순으로 제품을 보고 있게 되어 대응의 원리가 잘 적응된 것 같다고 생각했다. 4) 정보설계 11번가(전세계 배송관)의 경우, 정보설계가 뒤죽박죽 있는 듯한 느낌이었고 대체 뭐부터 봐야하는지 모르겠다는 생각이 들었다. 맨위에 검색창과 순위가 나오는 창이 왜 같이 있는 것인지 그리고 아이콘은 무슨기능을 하는 것인지 모르겠고 카테고리의 경우 너무 조그맣게 되어있어 글씨도 잘 보이지 않았다. 그리고 테마존과 카테고리존을 왜 나누었을까? 싶기도하고 뭘 선택해야할지 몰랐으며 가격부분에서도 어떤 것은 가격이 두개가 나와있어 대체 얼마인지 혼란스러웠다. 반면 29cm의 경우 내가 29cm사이트에 들어왔고 여기서 무엇을 할 수 있는지 위에서부터 알 수 있었다. 그리고 상위 메뉴바 카테고리를 통해서 어떤 것들이 있는지 볼 수 있었고 해당하는 것을 눌렀을때, 하위카테고리가 왼쪽 메뉴바에 나와 어떤 것을 더 사고 싶다를 정할 수 있게 해주었다. 그리고 가격부분에서 회색과 주황색으로 차이를 주어 얼마나 내가 할인을 받을 수 있는지 그리고 하트와 댓글 아이콘으로 얼마나 사용자들이 관심이 있는지 알 수 있어 눌러서 들어가고 싶게 끔 다음 단계를 유도하였다. 그래서 낮은 사용자에게 있어서 잘 학습할 수 있도록 설계를 잘했다고 생각했고 목표가 있어 들어온 사용자에게도 필요한 것을 구매할 수 있게 했다고 생각하여 이 사이트를 선정하였습니다. 기존에 올려주신분들 내용에 도움을 받아 저도 조금이라도 도움이 될까하여 공유해봅니다. 에릭선생님 감사합니다.사진이 위로가 있어서 작성하는데 어려움이 있었는데요, 보충할 거 있으면 알려주시면 감사하겠습니다!
- 해결됨뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
카카오 뱅크와 기업은행 I-One뱅크의 비교
ux 좋은 예와 나쁜 예 카카오 뱅크 VS 기업은행 I-ONE뱅크 . . 1. 휴리스틱 평가: 직관적인 사용 가능 카카오 뱅크: GOOD 일단 직관적이지 않기로 유명한 공인인증서 로그인 방식을 버렸다. 또한 이체와 사용내역 조회 빼고는 크게 별다른 기능이 노출되어 있지 않다. 카드 규격의 박스로 전자 지갑을 보는 것 같은 느낌도 들고 + 버튼을 누르면 쉽게 새로운 계좌를 만들거나 저금하거나 할 수 있다. 새로운 계좌를 만들면 또 카드형식으로 하단에 추가될 것임이 쉽게 예상된다 기업은행 I-ONE뱅크: BAD 일이년 전만 해도 이 UI보다도 더욱 복잡해서 위압감이 느껴지는 화면이었는데 그 사이에 시각적인 정렬이 꽤 많이 개선된 것 같다. 하지만 여전히 이체를 하고 싶으면 어디를 눌러야하는지 한눈에 알 수 있을 정도는 아니다. 메뉴를 누르면 나오는 수많은 텍스트 중에 이체를 찾아야한다. 일반 사용자가 가장 많이 사용하는 화면일텐데 위계 상 차별을 줘서 잘 보이게 해놓을 필요가 있어보인다. . . . 2. 휴리스틱 평가: 친근한 단어선택 카카오 뱅크: GOOD 카카오뱅크가 타겟 유저로 삼은게 금융 지식이 풍부하지 않은 20대 사용자인 것 같다. +를 누르면 어떤 것을 추가할 수 있는지 쉽게 풀어서 설명해준다. 기업은행 I-ONE뱅크: SO BAD 정확히 무엇인지 모르겠는 상품들이 너무 많다. 사전지식을 획득하려면 따로 추가적인 인터넷 검색을 해야된다. 내가 금융지식이 전무해서 잘 사용하지 모르는건가 하는 생각도 든다. 상품몰, 톡톡송금은 무엇인지, 환전지갑은 또 뭔지, IBK-Hybrid 카드는 또또 뭔지 모르겠다. 내가 전문적인 지식이 없는 것도 있겠지만, 상품 네이밍이 무엇을 뜻하는지 설명이 부족한 것도 사실인 것 같다. . . . 3. 쉬운 CTA 카카오 뱅크: GOOD 카카오 뱅크의 이체과정은 같은 계열사 제품인 카카오톡의 '카카오톡 공유하기'와 비슷한 UI를 공유한다. 사용자는 쉽게 어떤 사용자에게 돈을 보낼 수 있을지 예상할 수 있다. 그리고 즐겨찾기 기능으로 자주 보내는 사용자에게 보낼 수 있다는 것도 매우 유용한 사용성인 것 같다. 기업은행 I-ONE뱅크: NOT BAD 여전히 모르겠는 정보도 많지만 대충 어떤 버튼을 누르면 될지 위계는 잘 보인다. 요즘 이체과정이 다 지문인식같은 것으로 대체되어 있어서 그런지 이체 과정이 번거롭진 않았다.
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
강의 내용 문의 건
안녕하세요 강사님. 혹시 강의에 나온 SURF 사이트 주소를 좀 알수 있을까요 ?? 감사합니다.
- 미해결뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
좋은 UX 안좋은 UX
저는 UX 디자이너를 꿈꾸는 학생은 아닙니다. 프론트엔드, UI/UX 개발자가 꿈이 컴퓨터공학과 학생입니다. 디자이너가 아니더라도 제가 나중에 일하게 된다면 조금이라도 도움이 될것 같은 지식을 배우고 싶어 UX/UI 관련 내용이 궁금하여 이 강의를 시청하고 있습니다. 좋은 UX 와 안좋은 UX 의 구분을 정확하게는 못하지만.. 기능 위주로 제가 경험해보고 사용자 입장에서 불편했던 점에 대해 간단하게 과제를 제출하려고 합니다. - 안 좋은 UX 넷플릭스 vs. 왓챠 넷플릭스 같은 경우에는 기존에 시청하던 것을 보지 않으려고 해도 X 표시가 없는 것을 볼 수 있다. 일정 시간 후에는 사라지지만 그 전까지는 불편하게 사용해야 되는 점이 있음. 기존에 시청하던 것을 보지 않을 경우를 생각한 왓챠의 경우, X 버튼을 눌러 제거할 수 있다는 점 좋은 UX 개인적으로 넷플릭스가 장르를 구분해놓은 것에 대해 (이전보다 정말 많이 바뀌었지만), 아직도 불편한 점이 많은 상태. 왓챠의 경우에는 탐색하기에 마우스를 올려놓으면 3가지 형태(장르, 국가, 특징)로 선택하여 원하는 키워드를 선택할 수 있다. 특징 같은 경우에는 내가 원하는 감정과 키워드에 대해 선택할 수 있다는 것이 세심하다고 생각했다. '평가하기'를 통해 나의 취향을 분석해주고 내가 몰랐던 나의 모습을 알 수 있다는 것도 하나의 이벤트 같았다.
- 해결됨뉴욕 프로덕트 디자이너가 알려주는, 입문자를 위한 UX디자인 개론
퍼소나 왜 사용하는걸까 강의를 보고 질문드립니다.
안녕하세요! 저는 한국에서 산업디자인학과에 재학 중인 학생입니다. 제가 저번 학기 환경디자인 수업에 '거리두기를 위한 한강공원 어플리케이션'을 디자인 한 적이 있습니다.코로나 방역단계가 높아진다고 오픈 스페이스인 한강공원을 폐쇄할 것이 아니라 근린 시설들을 예약제로 돌려 거리두기를 유지한 채 사용하자는 것이 그 아이디어였는데요. 한강공원이 남녀노소 가리지 않고 이용하는 시설이다보니 어떤 계층을 타겟으로 퍼소나를 만들어야할지 모르겠어서 20~50대까지의 모든 성별의 퍼소나를 만들었던 적이 있었습니다... 한 집단이 대표성을 띄기에는 너무 골고루 잘 이용하더라구요. 이럴때에는 퍼소나를 어떻게 사용해야될까요? 그래도 사회생활이 가장 활발하며 한강 이용을 제일 많이 '할 것 같은' 30대 여성을 직관으로 선정하긴 했는데... 이런 식으로 해도 괜찮은 걸까요?