UIUX부트캠프 (12) 썸네일형 리스트형 [레퍼런스 분석3] 콘텐츠 플랫폼 분석 (미디엄, 브런치, 커리어리) 금주는 본격적으로 UI 디자인에 들어갔는데, 막상 카드와 리스트 모듈을 활용해 레이아웃을 짜려고 하니 좀 막막해 콘텐츠를 다루는 플랫폼을 찾아봤다. 사진과 글을 어떻게 배치했는지, 폰트의 강약은 어떻게 줬는지, 카드 형태와 리스트 모듈 중심으로 탐색 시작! 디자이너들이 자주 찾는 미디엄, 브런치, 커리어리 총 세 곳을 분석했다. 1. 미디엄 프라이머리 컬러를 활용한 심플한 UI다. 아무래도 콘텐츠를 돋보이게 하기 위해 많이 절제한 듯 보인다. 프라이머리 컬러를 활용했는데, 개인적으로 약간 올드한 느낌이 든다. 선뜻 잘 안 쓰는 녹색이랄까. 이것도 색에 대한 편견이려나. 세 번째 카드 모듈에 포함된 항목을 떼어 보니 글쓴이/제목/발행일/소요시간(?)/추천했다는 문장 or 분야 이렇게 이루어져 있고, 아이콘.. [UIUX부트캠프 수강 후기] 제로베이스 UIUX디자인스쿨 6기 후기 (내돈내산) 벌써 12월이라니! 이것은 제로베이스 부트캠프 종강이 얼마 남지 않았다는 뜻이기도 하다. 21년 12월, 5년 가까이 일한 직장에서 퇴사하고 새로운 도전을 해보기로 결심했다. 바로 편집 디자인에서 UIUX분야로의 이직이다. 책자 및 포스터 제작, 웹배너 등 인하우스에서 다양한 디자인 일을 하긴 했지만, 기초지식, 다루는 툴, 업무 프로세스가 다르니 나에겐 새로운 분야나 다름없었다. 그럼에도 불구하고 '디자인'이라는 공통분모가 있으니 혼자서 독학으로 해보자 호기롭게 시작했으나......! 얼마 못 가 독학의 한계에 부딪혔으니 그건 바로 '확인할 수 없는 성장 포인트'와 '포트폴리오'라는 큰 산이였다. 책과 관련 강의를 통해 이론에 발을 뗄 수는 있었으나, 실무에서 툴을 어떻게 활용하는지, 툴에 익숙해지기까.. UIUX부트캠프, 12주 차 공부 기록 (컨셉 / 메타포 / I.A / 벤치마킹 / 와이어프레임 / 디자인시스템) 지난주에 이어 금주는 디자인 컨셉 → 메타포 설정 → 정보구조화(I.A) → 와우포인트 도출 및 벤치마킹 → 와이어프레임 → 디자인시스템을 거쳐 포트폴리오를 채워나갔다. 후하. 쓰고 보니 양이 많은 것처럼(?) 느껴지지만 개인적으로는 11주차 과제보다 힘들지는 않았다. 지난주에는 환경 분석과 리서치를 바탕으로 '문제를 정의'했는데 오히려 이 과정이 어렵게 느껴졌기 때문이다. 첫 포트폴리오여서 내가 설정한 가설과 사용자가 실제 느끼는 문제들의 간극을 어떻게 조정해 풀어야 하는지 감을 잡기가 어려웠다. 이런 상태라면 포트폴리오를 빠르게 완성하고 싶다는 마음이 오히려 편견으로 작용할 수도 있겠구나 싶어서 조심스러웠다. 그럴 때마다 부트캠프 초반 강사님들이 해준 말을 기억했다. "사용자가 우리가 예상하는 대로 .. UIUX부트캠프, 11주 차 공부 기록 (라이브 피드백 / 발표 / 수정) 지난주 과제가 환경분석, 유저리서치, 문제정의였다면, 이번 주에는 텍스트 피드백과 라이브 피드백을 토대로 지난 과제를 개선해야 했다. 지난주에는 자료조사 단계라고 생각해 최대한 많은 자료를 찾기 바빴다. 찾은 정보들을 하나의 페이지에 길게 담아 제출했는데, 멘토님으로부터 1.각 단계별로 PPT사이즈(1920x1080) 한 장에 정보를 정리할 것, 리서치의 내용을 한 눈에 파악하기 쉽게 제목을 넣어줄 것을 텍스트로 당부받았다. 그때 깨달았다. '아, 지금부터 포트폴리오 틀을 잡아야 하는 시기구나!' 이번 주에는 처음으로 라이브 피드백도 진행됐다. 온라인에서 실시간으로 만나는 건 처음이라 어떻게 진행될까 궁금해하고 있던 찰나, 매니저님이 오후 즈음 개별 발표 후 피드백이 진행될 것이라 공지를 띄웠다. '뭐?.. [레퍼런스 분석2] 커뮤니티 기능 중심으로 분석한 디자이너를 위한 포트폴리오 사이트 (노트폴리오 vs 비핸스) 1. 노트폴리오 (포트폴리오 중심) 노트폴리오 :: 크리에이티브 네트워크 by 스터닝 노트폴리오는 여기저기 흩어져 있는 아티스트와 디자이너들이 한 곳에 모여 자신의 작업을 공개하고 이야기하는 공간으로 스터닝에서 서비스합니다. notefolio.net 노트폴리오는 디자이너들이 가장 많이 찾는 사이트 중 하나로 이름에서 눈치챌 수 있듯 '포트폴리오' 중심 사이트다. 디자이너들에겐 1. 작업물 업로드하거나(웹 포트폴리오 역할) 2. 피드백을 받거나 3. 레퍼런스 탐색 용으로 자주 쓰인다. Adobe에서 운영하는 Behance와 가장 유사한 사이트라고 할 수 있다. 웹과 앱 서비스를 모두 운영 중이고, 올해(?) 커뮤니티 페이지를 별도로 만들어 지원하기 시작했다. 커뮤니티에는 1.자체 기획 워크숍, 2. 다양한.. UIUX부트캠프, 9주 차 공부 기록 (디자이너 에세이 작성 및 포트폴리오 주제 선정) 이번 과제는 포트폴리오에 들어가는 1.디자이너 에세이 쓰기와 2.(첫)포트폴리오 주제 정하기였다. 디자이너 에세이라...! 부트 캠프 초반 강사님이 '디자이너로서 어떤 생각을 가지고 있는지' 에세이로 짧게 보여주면 좋다고 해서 '포트폴리오 준비할 때 꼭 써야지' 벼르고 있었는데, 막상 과제로 주어지니 쉬이 갈피가 잡히지 않았다. 내 장점이 뭐가 있을까에서부터 시작했다. '정리정돈', '신중함', '편집 디자인 실무 경험', '분석력' 고민 끝에 장점을 찾아내긴 했는데, 근거를 대자니 장황한 자기소개서가 되는 듯해 다시 지우고 강점보다는 '디자인할 때 내가 추구하는 가치와 방향 위주로 써보자' 싶었다. 깔끔하고 심플한 걸 좋아하는 나는 '명확성', '정리정돈', '디테일'의 키워드들이 떠올랐다. UIUX .. UIUX부트캠프, 7주 차 공부 기록 (동종 유사앱 3종 AS-IS분석 / 마켓컬리, GS프레시몰, 쿠팡 로켓프레시) 이번 주도 지난주에 이어 그룹 프로젝트! 6주 차엔 나를 포함한 세 명의 팀원이 각각 하고 싶은 브랜드 하나를 정해 AS-IS 분석했다면, 7주 차엔 6주 차에 다른 팀원이 분석한 앱을 이어 받아 추가로 동종 유사 그룹까지 분석하는 과제다. 우리 팀은 첫 AS-IS 분석 때 배달의 민족 / 마켓 컬리 / CGV 앱 세 가지가 나왔고 그 당시 난 배달의 민족 앱을 선택해 분석했었다. 이번엔 다른 분이 분석했던 마켓컬리앱을 이어받아 동종 유사 분석을 진행하게 되었다. 온라인 식재료 판매업체인 마켓컬리의 동종 유사 앱으로 GS프레시몰, 쿠팡 로켓프레시를 진행했다. 개인적으로 가장 자주 사용하는 앱인 로켓 프레시와, 최근에 사용해본 경험이 있는 마켓컬리가 있어 부담스럽진 않았다. 지난번 처음으로 AS-IS분석을.. UIUX부트캠프, 6주 차 공부 기록 (배달의민족 앱 AS-IS분석) 제로베이스 UIUX부트캠프 6주 차에 첫 그룹 프로젝트로 AS-IS 디자인/콘텐츠 분석 과제가 주어졌다. 3인 1조로 팀을 구성한 후 각자 원하는 앱을 분석해 문서로 제출해야 했다. 세 명이서 팀이지만 사실상 지난주엔 어떤 앱을 선정했는지 공유한 후 각자 조사하는 거라 그룹 프로젝트(?)라고 크게 느끼지는 못했다. 다음 주, 다다음 주 AS-IS 분석한 브랜드를 팀에서 릴레이로 이어받아 동종유사분석(7주 차), 디자인 벤치마킹(8주 차)까지 하는 거라 그룹 프로젝트로 묶은 듯하다. AS-IS는 우리가 개선할 대상의 현재를 뜻한다. AS-IS분석을 하는 이유는 현재 앱이 가진 디자인과 콘텐츠가 어떤 상태인지 찬찬히 들여다보는 과정에서 인사이트를 얻을 수 있기 때문이라고 앞 강의에서 들은 기억이 있다. 어떤.. UIUX부트캠프, 5주 차 공부 기록 (당근마켓 클론디자인) 5주 차 과제 1. a/b/c에 대해 최대한 많은 페이지 수집 후 클론 디자인 (짧게 이유 서술) a) 커머스 상세 화면 페이지 b) 커머스 장바구니 페이지 c) 커머스 주문/결제 페이지 2. 당근 마켓 모작, 클론 디자인(10page) 지난주에 이어 이번 주도 클론디자인! 4주 차 과제의 연장선이라 할만 하겠다 싶었데, 흠................... 양이 달랐다. 당근 마켓 앱 페이지를 모작해야 하는데, 양이 10page라니...! 부트캠프에서 따라 하라고 준 이미지 길이가 다 달라서 사실 체감 양은 그 이상이었다. 혼자 독학했다면 절대 하지 않았을 범위와 양...... '과제'라서 하게 된다. 하면서 느낀 점은 '이렇게 들여다볼 시간이 분명 필요하겠구나.'였다. 수많은 앱을 이용하면서 어렵지 .. UX부트캠프, 4주차 공부 기록 (UI분석, 여백 및 간격 값 입력) 조금 늦은 4주 차 공부 기록. 지난주엔 Chapter 4. 스케치(Sketch) 툴 강의를 들었다. 강사 분이 똑같아서 그런지 프리스쿨 예제를 다시 듣는 느낌이었다. UX 분야에 대한 이야기보다는 툴 자체에 대한 사용법이 대부분이라 개인적으로 듣기는 힘들었다. 이미 프리스쿨 과제를 끝낸 터라, 어느 정도 툴을 사용하는 방법에 대해서는 숙지하고 있었기 때문이다. 이번 주는 Adobe XD...... 강의, 툴 관련 강의 비중이 너무 많아 이 점이 조금 아쉬울 따름이다. 윈도우를 쓰고 있는 나는 Sketch 툴을 사용할 수 없어(맥북에서만 작동하는 툴) 지금 당장 '우와, 이런 기능이 있다니'하며 놀랄 일은 없었지만 UX 관련 툴의 기본적인 기능과 인터페이스에 공통점이 많기 때문에 숙지할 겸 차근차근 들었.. 이전 1 2 다음
