본문 바로가기

UXUI design/회고・학습일지

(21)
[WIL] 0621 주간회고 지난 일주일 간의 배움 중 가장 어려웠던 내용은 버튼과 텍스트필드 만들기였다. 그 과정에서 프로퍼티, 인스턴스, 배리언츠가 뭔지, 언제 쓰는 것인지 도통 알기가 어려워서 어제 노트에 하나하나 다 적었던 일이 가장 기억에 남는다. 그 과정을 한번 거치니까 어떤 패턴을 갖는지 왜 이때 이 기능이 쓰이는지를 어느 정도는 알게 됐던 것 같다. 이렇게 익히는 방식이 나한테는 도움이 된다는 것도 깨달았다!  이렇게 하면서 속도에 뒤처지는 건 아닌가, 하는 생각이 들기도 했다. 그럼에도 몇 시간을 투자한 가치가 있다고 느껴졌던 때는 오늘 체크박스와 라디오버튼 만들기를 배우면서였는데, 앞의 내용을 먼저 잘 이해한 후에 새로운 내용을 접하니까 패턴 같은 게 있다고 느껴져서 크게 어렵지 않았다. 나아가, 먼저 해볼 수 있..
[TIL] 0620 학습일지 오늘은 다음 강의를 들을 차례였는데, 어제 공부한 내용(버튼 컴포넌트, 텍스트필드 컴포넌트 만드는 방법, 인스턴스, 배리언츠 등의 개념)을 잘 이해하였는지 스스로 확신할 수 없었다. 이해되지 않은 상태로 넘어가는 게 찝찝했다. 결국 다시 강의를 들으면서 정리해 보기로 했다.  튜터님이 컴포넌트를 만드는 방식을 하나하나 짚어가며 적고 따라해봤다. 그랬더니 앵무새처럼 따라 할 때와 달리 버튼의 위계, 크기, 상태가 무엇을 의미하는지, 텍스트 프로퍼티는 무슨 역할을 하는지.. 등 선 이해 후 스스로 컴포넌트를 만들어볼 수 있게 됐다.이해가 되니까 어려워서 강의내용대로 따라만 하게 되던 과제를 자연스럽게 배운 내용에 연결지어 할 수 있었다.
[TIL] 0619 학습일지 컴포넌트 디자인에서 컴포넌트란 파운데이션 조합을 쌓아 만들어지는 구성품을 이야기한다. 개체라고 생각해도 되겠다.  버튼 컴포넌트를 보았을 때, 모양 색상 모두 다르지만 유저가 '버튼'이라고 받아들이는 이유는 버튼의 하는 일을 기준으로 생각하기 때문이다. 즉 컴포넌트는 모양이 아니라 기능이 중요하다.  컴포넌트와 인스턴스의 관계마스터 컴포넌트는 원본이고, 인스턴스는 마스터 컴포넌트의 복제본이다. 마스터 컴포넌트를 복사하면 인스턴스가 생긴다. 피그마에서는 빈강정같은 아이콘(♢)이 붙어 있다.  - 컴포넌트를 수정하면 인스턴스에도 반영된다.- 인스턴스를 먼저 수정하면 컴포넌트를 수정해도 반영되지 않는다.- 컴포넌트를 지우더라도 인스턴스는 남아 있다. - 연결을 해제하면 인스턴스는 컴포넌트와 분리되고, 일반적인..
[TIL] 0618 학습일지 📌컨스트레인트Child Container와 Parent Container 컨테이너 사이에있 파란색점선이 Child Container가 Parent Container에 가지고 있는 제한, 즉 컨스트레인트이다.정확히 말하면, 자식 컨테이너가 부모 컨테이너에 고정되어 움직이는 '핀의 위치'를 컨스트레인트라고 한다. 위 이미지로 보았을 때, 자식 컨테이너는 부모 컨테이너의 사이즈가 변할 때, 부모 컨테이너의 위쪽과 왼쪽을 기준으로 고정되어 움직인다는 뜻이다.컨스트레인트는 댜른 말로 하면, '앵커'라고 한다.    📌프레임 리사이징프레임을 오토레이아웃으로 감싸는 순간, Fixed외의 다른 사이즈값이 생긴다. 이를 피그마에서는 리사이징이라 부른다.   종류Fixed 고정값 Hug 자식 컨테이너의 크기에 맞춰 ..
[TIL] 0617 학습일지 📌 오토레이아웃 오토레이아웃(auto-layout)은 프레임을 배치하고 정렬하여 레이어를 코드 블록처럼 쌓는 핵심 레이아웃 기능이다. 말그대로, 레이아웃을 자동으로 조정할 수 있는 기능이다. 오토레이아웃은 개체를 내부 여백(배딩)으로 감싸 컨테이너로 만든다.간격에 맞게 컨테이너를 쌓을 수 있게 해준다.   실습을 통해 알게된 점① 프레임이 아닌 개체에 오토레이아웃을 적용하면 기본 패딩값을 가진 오토레이아웃 컨테이너가 생성된다. ② 이미 만들어진 프레임에 오토레이아웃을 적용하면 프레임 자체가 오토레이아웃으로 변경된다.③ 특이점 - 정렬방향 변경 시 원근   레이어 패널에서 위에있으면 더 앞에있는것이 일반적이나,오토레이아웃(컨테이너2) 안에서는 밑에 있으면  더 앞에 있다.아래 이미지에서 확인 가능하다. ..
[WIL] 0614 주간회고 FACTS(사실, 객관) : - ① 디자인씽킹 프로세스(5단계)를 활용해 음식 배달/외식 시장에 필요한 아이디어를 도출하고, ② 디자인 원칙을 활용한 레퍼런스 분석을 진행했다. 이때 음식 배달/외식 서비스에 경험이 있는 사람의 도움이 필요할 것 같아서 주1~2회 배달 음식을 시켜먹는 지인을 만나 직접 인터뷰를 진행했다. FEELINGS(느낌, 주관) :- 인터뷰를 진행하면서, 혼자서 생각하지 못한 다양한 관점의 이야기를 들을 수 있어서 인터뷰 진행해보길 잘했다는 생각이 들었다. 한명을 인터뷰 해도 이렇게 색다른데, 5명 정도 제대로 인터뷰 해보면 정말 좋은 자료들이 되겠다 싶었다. - 위 과제를 처음 받았을 때는 머릿속에 ???가 가득했는데, 이해될 때까지 읽고 또 읽고 정보 모아보고 마침내 이해되는 과..
[TIL] 프로덕트 아이덴티티: 디자인 컨셉 구축법 프로덕트 아이덴티티 컨셉 구축법  1단계. 브랜드 보이스 설정하기  브랜드 보이스란,브랜드가 소비자에게 전달하고자 하는 '일관된 메세지와 톤'을 의미한다.  제품의 브랜드 보이스 키워드 고려사항 - 타겟 사용자에게 적합한가? (예: 2-30대 사용자가 주된 사용자라면 이들에게 적합한가)- 시장 경쟁력이 있는 보이스는 무엇인가? (예: 저가 커피 브랜드 color : 노란색 -> 메가커피, 빽다방, 컴포즈) - 시장 변화와 타겟 사용자의 니즈에 적용할 수 있는가? (시장은 되게 빠르게 변한다. 한철 유행만을 따라가는 것은 🙅‍♀️)   2단계. 톤앤매너 무드보드 만들기  무드보드를 만드는 이유는, 시각적으로 구체화 하기 위한 아이디어 구상 단계 프로세스이다.  제작 시 중요한 것!- 최대한 다양한 각도에..
[KPT] 필수 과제①,② - 회고. 지난 일주일 간 UXUI 디자인 입문강의를 듣고,이번 월요일부터 3일 간 주어진 필수 과제 ①,②를 통해디자인씽킹 사이클에 대해 이해하고, 문제를 정의하고, 아이디어를 도출하면서문제정의의 한 싸이클을 완성해보았다.  처음에는 무엇을 해야하는건지 감이 잘 안잡혀서 노션에 흩어져있는 정보를 한 데 모아 정리하고 계속 읽어봤다.  과제의 의도를 파악하고, 하나씩 방향을 찾아가는 과정에서 되게 오랜 시간이 걸렸는데 한 싸이클을 완성하니까 이제야 조금 윤곽이 잡히는 듯 하다.  아직 미완성의 부분이 분명히 있을테니, 얼른 피드백을 받아보고 싶은 마음이다.   더보기KPT 회고---> KEEP(지속할 것), PROBLEM(문제가 된 것), TRY(다음에 시도할 것)를 생각해 보는 것. KEEP(지속할 것) : 문..