본문 바로가기

UXUI 디자인 입문(23.12.18~24.01.29)

 (39)
피그마 활용법(1)_1,2주차 정리 [수업 목표]피그마 핵심 기능인 프레임과 그룹의 차이를 이해하고 사용합니다.피그마 프레임을 정리하고 정렬하는 방법을 배웁니다.오토레이아웃과 컨스트레인트를 활용해 레이아웃을 만들고 조정하는 방법을 이해합니다.프레임과 그룹 - 입문과 심화를 나누는 기준이 됨. 중요! -프레임 : 블록 개념 -그룹 : 개체를 붂는 개념 -정렬개념 : 화면에 배치하는 규칙 -오토레이아웃 : UI에서 가장 중요한 개념, 좀 더 빠르고 쉽게 레이아웃을 만들 수 있게 도와주는 개념 -컨스트레인트 : 어떤식으로 움직일지 정하는 것. 1. 프레임과 그룹 -코드와 디자인 : 박스 형식으로 디자인 해야한다.(코드가 디자인을 레고처럼 쌓아서 박스 모델을 만듦.) -프레임과 그룹의 개념 : 개체를 만드는 기본적인 단위, 차이는 큼 -프레임(=..
Figma 활용법 기초 [오전] 오전에는 저번 이론 수업을 보충하는 시간을 가졌다. 저번주에 잘했던 못했던 열심히 진도에 맞춰서 몰입해서 공부했던 탓일까.. 오늘은 집중이 하나도 되지 않았다. 복습할 건 많지만, 왜때문인지 손이 잘 안 가고 집중도 잘 안되는 이 마음이란 무엇인가. 내배캠 수업을 진행하면서 오늘 같은 날은 처음이었던 것 같다. 늘 항상 집중해서 스케쥴 떠놓고, 그 스케쥴 맞춰서 공부에 몰입하는게 그간의 빅재미였는데.. 오늘은 왜 이렇게 노잼이었을까. 다시 마음을 다잡고 진지하게 수업에 임해야 겠다. 이론 수업을 나만의 노트로 작성해 두었기 때문에 프린트해서 간혹 들여다본다. 까먹지 말고 틈틈이 봐야겠다. 이상 끗. [Figma Start !] 오늘 피그마 수업을 듣기위해 기다려왔다. 저번주에 이론 수업 또한 매..
개인 과제(Develop)+WIL WIL (Weekly I learned) 지난 일주일을 돌아봄으로써 나의 현재 상태를 파악 이번 한 주 동안은 이론적인 강의를 수강하였다. 많은 내용이 강의에 압축되어 있어서 진도를 알맞게 진행하기에는 벅찼지만, 못할 정도는 아니었다. 집중해서 정리하는 시간을 가진 것이 좋았다. 강의 튜터선생님도 설명을 꼼꼼하게 이해하기 쉽게 진행해 주셔서 개인적으로 아주 만족한 강의였다. 덕분에 UXUI 디자이너로써 알아야 할 기본적인 개념이 정리 되었다. 강의 주차는 계획대로 진행을 마쳤고, 개인 숙제 또한 계획대로 진행했다. 개인 숙제를 진행하면서, 논리적으로 5whys를 써내려 가는데, 여러번 수정했다. 중간에 내용 구성을 어떻게 해야 할지 다시 생각해 보았고, 좀더 복잡하지 않게 단순하게 문제를 정의하도록 신경..
개인 과제 [과제 목표] 디자인씽킹과 디자인 가이드라인을 활용해 프로덕트의 문제를 정의하고 솔루션을 도출해 봅니다. > 문제 정의 → 가설 수립 → 솔루션 설계의 각 과정이 논리적으로 설계되어야 합니다. ✅ 11번가 [ 홈 화면 + 하단 네비게이션 ] 1. 디자인씽킹 프레임워크-문제를 정의 및 가설 수립 (1) 제품의 주요 사용자는 누구인가요? - 20대~60대 - 여성 및 남성 (2) 사용자의 어떤 문제를 발견했나요? ① 화면의 내용이 특정한 기준 없이 연속해서 나열되어있다.(카테고리 탭, 상품 카드) ② 너무 많은 정보를 담고 있다.(끝도 없이 내려가는 스크롤) ③ 하단 네비게이션 바의 최근 본 상품의 아이콘은 '네모'이다. 타이포(슈팅배송), 플랫 아이콘(로그인,최근 본 상품)과 리얼이미지(중앙 광고 버튼)가..
UXUI디자인입문_6주차 레퍼런스 분석 레퍼런스 분석이 무엇인지 알고 필요한 상황에서 해볼 수 있습니다. UX/UI 디자인 패턴을 이해하고 활용할 수 있습니다. 도메인별 특징을 파악하고 레퍼런스 분석을 할 수 있습니다. ✅ 레퍼런스 분석 - 레퍼런스 분석이란? 여러가지 상황을 상세하게 검색해서 알아가는 과정, 세부 요소들 관찰(좋은/나쁨점 이유 분석=인사이트) - 레퍼런스 분석은 왜 하나요? 끊임없이 무언가에 대해서 생각하는 과정, 사고력 기름, 본인의 디자인을 높이는 길. [레퍼런스 분석하는 방법] ① 화면 구조 분석 : 사람마다 다른 기준으로 나눌 수 있음, 파운데이션(원자;색상/폰트/아이콘) - 엘리먼트(원자+원자;버튼/뱃지/탭) - 모듈(원자+원자+원자;리스트/캐러셀/네비게이션) - 페이지(홈/마이페이지/장바구니/회원가입) ② 디자인 ..
UXUI디자인입문_5주차 디자인 원칙 사용성을 지키면서 심미적인 UI와 인터렉션을 구현할 수 있는 비주얼 역량을 기릅니다. 게슈탈트 심리학이 무엇인지와 세부 원리들을 이해합니다. UX 비주얼 디자인 원칙을 이해하고 디자인 원칙을 활용할 수 있습니다. UX/UI 심리학 법칙의 유용성을 알고 필요한 원칙을 찾아 학습할 수 있습니다. ✅ 디자인 원칙 - 디자인 원칙이란? 인지심리학, 다양한 사람들이 비슷하게 느끼고, 행동하는 방식에 기초, 사용성이 높은 디자인 할 확률 - 디자인 원칙의 종류 ① 게슈탈트 심리학 : 주변에 있는 요소간의 관계/맥락에 따라 다르게 받아들인다. ② UX 비주얼 디자인 원칙 : UX에 영향을 끼치는 것들을 살펴본다. ③ UX/UI 심리학 법칙 : 사람의 행동에 대한 설명을 한다. ④ 기업의 디자인 원칙 : 위 3가지 바..
UXUI디자인입문_4주차 디자인 툴 디자인 툴이 무엇이고 어떤 것들이 있는지 배웁니다. 인터페이스 디자인 툴에 대해 더 자세히 알아봅니다. 상황에 맞는 프로토타이핑 툴을 선택할 수 있습니다. ✅ 디자인 툴 - 디자인 툴이란? 디지털로 이미지를 만들거나 편집할 수 있는 컴퓨터 프로그램 [디자인 툴 4종류] ① 인터페이스 디자인 툴 : 피그마, 스체치, XD- 화면에 인터페이스를 그리기 위한 툴, 벡터 방식 ② 그래픽 디자인 툴 : 어도비 포토샵(비트맵,사진), 일러스트레이터(벡터,그래픽) ③ 3D 그래픽 디자인 툴 : 시네마 4D, 블렌더 ④ 모션 그래픽 디자인 툴 : 프리미어(찍은 영상), 애프터이팩트(그래픽 모션)-움직이는 영상을 만드는 툴 - 비트맵과 벡터의 이해 ① 비트맵 이미지 : 픽셀 확장자(jpeg, jpg, pngm gif),..
UXUI디자인입문_3주차 UXUI 실무 프로세스 제품팀이 무엇인지 이해합니다. UX/UI 디자이너의 기본적인 디자인 프로세스를 파악합니다. UX/UI 디자이너가 실무에서 누구와, 어떤 방식으로 일하는지 익힙니다. ✅ 제품팀이란? 다양한 직무의 사람들로 구성(최소한 제품관리자 1, 디자이너 1, 엔지니어 2) - 디자인(UX 디자이너), 기획(PM), 개발(프론트 엔지니어), 마케팅(그로스 마케터), 데이터(데이터 애널리스트) 이외, 개발(서버 엔지니어), 디자인(UI 디자이너), 디자인(프로덕트 디자이너), 기획(PO), BO(비지니스 오퍼레이터) - 목적 조직 : 스쿼드, 사일로. 목적을 달성하기 위해 다양한 직무의 사람들 - 기능 조직 : 챕터. 같은 직무의 사람들, 전문성을 높일 수 있음.TF형태* - 매트릭스 조직 : 스타트업 방식. 속도를 높..

티스토리툴바