블로그
전체 4#카테고리
- UX/UI
#태그
- 피그마
- 베리어블
- 디자인시스템
- 디자이시스템
- 인프런워밍업클럽스터디2기
2024. 10. 27.
0
[인프런 워밍업 클럽 2기 디자인] 4주차 발자국 및 회고
일주일간의 학습에 대한 회고이번 주에는 배리어블을 활용하여 B2B 이커머스 이러닝 페이지, 모바일 OTT 서비스 페이지 등을 만들었습니다. 만드는 과정에서 화이트 백그라운드 기반으로 컴포넌트 만들었고, 메인 페이지와 콘텐츠 페이지에 베리어블 모드를 설정한 후, asset에서 드래그 앤 드롭으로 가져오니 모든 것이 자동으로 변경되는 점이 정말 신기하고 멋있었습니다. 이렇게 작업함으로써 디자인하는 데 있어 시간적으로 효율성을 크게 느낄 수 있었습니다. 또한, 어떤 페이지를 만들어도 일관된 디자인을 유지할 수 있다는 점이 베리어블의 큰 장점이라고 생각합니다. 조립하는 느낌이라서 매우 좋았습니다. 마지막 주에는 특강도 있어서 베리어블 프로토타이밍의 끝판왕을 경험했습니다. 항상 느끼는 건데 특강 넘 재미있습니다. 일주일 동안 잘한 점강의를 완강하고 미션을 클리어했습니다!아쉬웠던 점벌써 마지막 주라니… 더 배우고 미션을 해보고 싶은 마음뿐입니다.보완하고 싶은 점배운 내용을 자기화하고 실무에 적용하고 싶습니다.
UX/UI
・
피그마
・
베리어블
・
디자인시스템
2024. 10. 20.
0
[인프런 위밍업 클럽 2기 디자인] 3주차 발자국 및 회고
일주일간의 학습에 대한 회고 2주차의 연장선으로 네비게이션 컴포넌트와 베리어블 다크모드 개념에 대해 익힐 수 있었습니다. 로컬 베리어블에 값을 입력하면 상황에 따라 변경이 되는 점이 정말 흥미로웠고, 이에 따라 피그마 베리어블의 작업 효율성을 칭찬하는 이유를 이해할 수 있게 되었습니다. 이후 반응형, B2B 이커머스 어드민 페이지를 만드는 과정에서 컴포넌트를 조합하는 시간에, 기존에 만들었던 컴포넌트의 문제점을 발견하게 되었고, 당황스럽고 수정은 어떻게 하는지 혼란스러운 시간을 경험했습니다.ㅠㅠ 생각보다 컴포넌트를 만들 때 정교한 기획이 필요하다는 점과 문서화 정리가 얼마나 중요한지 배웠습니다. Assets에서 컴포넌트를 검색할 때, 같은 항목이 왜케 많이 나오는 이유도 저의 실수에서 비롯된 것임을 깨달았습니다. 일주일 동안 잘한 점 시간이 늦어도 매일 강의를 수강한 점 아쉬웠던 점 본업으로 인해 미션을 제출 날짜를 맞추지 못한 점 컴포넌트 문서화를 더 잘하고 싶습니다. 보완하고 싶은 점 강의 중 그룹화하고 오토 레이아웃을 반복적으로 다루는데, 아직 개념으로 잘 이해하지 못하고 있습니다. 이해하지 못한 부분을 복습으로 채워나가고 싶습니다. 컴포넌트 문서화와 함께 variant property 보기 쉽게 순서를 정리 할 것입니다. 다음 주에는 마지막 주에는 그동안 해왔던 것보다 더 열정적으로 작업해 보겠습니다. 아직 제출하지 못한 미션뿐만 아니라 앞으로 있을 미션까지 최선을 다할 것입니다.
UX/UI
・
디자인시스템
・
피그마
・
베리어블
2024. 10. 13.
0
[인프런 위밍업 클럽 2기 디자인] 2주차 발자국 및 회고
인프런 위밍업 클럽 2기 2주차 일주일간의 학습에 대한 회고 컴포넌트 주제로 학습하면서 입력, 디스플레이, 피드백 등 다양한 종류의 컴포넌트를 만들 수 있다는 것을 알게 되었습니다. 매일 커리큘럼에 따라 진도를 나가면서 재사용되는 UI 요소를 효율적으로 관리할 수 있는 컴포넌트와 인스턴스 개념을 익혔고, 디자인 시스템이 더 매력적으로 느껴졌습니다. 아직 디자인 시스템이나 피그마에 대한 기본적인 지식은 부족하지만, 강의를 따라가며 하나씩 배워가는 재미가 있었습니다. 다만, 미션이 3개나 있어서 체력적으로 힘들었습니다. 다음 주도 걱정이네요.ㅠ 일주일 동안 잘한 점 하루 목표량을 꾸준히 지킨 점 미션 포기하지 않은 점 아쉬웠던 점 오토 레이아웃(Fill, Hug, Fix)과 컴포넌트에 대해 개념을 정확하게 이해하기보다는 대략 느낌으로 학습한 것 같음 보완하고 싶은 점 체력적으로 힘들어서 복습하지 못한 점 아직 컴포넌트를 완벽하게 마스터하지 못했기 때문에 다음주에는 더 명확하게 정리해 보고 싶음 다음 주에는 기본적으로 커리큘럼을 따라 학습하고, 미션도 포기하지 않고 끝까지 해내고 싶습니다. 이번 주 한번 포기할지 고민했던 순간이 있었거든요.
UX/UI
・
디자인시스템
2024. 10. 06.
0
[인프런 위밍업 스터디 2기 디자인] 1주차 발자국 및 회고
1. 강의 수강일주일 동안 학습했던 내용Figma의 베리어블, 색상, 간격, 타이포그래피, 아이콘, 그림자 효과, 반응형 기준점 그리고 입력 컴포넌트를 만드는 과정에 대해 집중적으로 학습했습니다. 스스로 칭찬하고 싶은 점 피그마 베리어블 개념을 습득하는데 많은 시간을 투자하고 매일 디자인 공부한 점 아쉬웠던 점 강의를 듣고 미션까지 수행하는데 생각했던 시간보다 3배 이상 소요되었는데요. 아직 피그마가 익숙하지 않아서 한 단계 진행할 때마다 강의를 보고 또 보고 모르는 부분은 검색하면서 작업했습니다.보완하고 싶은 점하루 진도 맞춰 가면서 미션에만 집중했는데요. 이번엔 디테일한 부분들도 생각하면서 작업해 보고 싶습니다. 그리고 시간도 더 넉넉하게 잡고 매일 디자인 공부하기 다음 주 학습 목표 미션 꼭 제출하기 피그마 부족한 기초 부분을 따로 더 공부하기 회고 이번주 강의를 통해 디자인 시스템의 필요성도 배우고 피그마 베리어블에 대한 좋은 점을 듣는 순간 꼭 완강하고 싶은 생각이 들었는데요. 베리어블 구조, 이름을 만드는 과정에서 같이 협업하는 사람들과 기획적으로 커뮤니케이션을 해야 하는 부분도 새롭게 크다는 걸 느꼈습니다. 그리고 피그마에서 플러그인을 많이 사용해보면서 실용적이고 넘 재미있었습니다. 2. 미션 #1 로컬베리어블 primitive, theme, semantic 색상 베리어블 등록 타이포그래피 스타일 플러그인을 사용해 등록 #2 feather 아이콘 컴포넌트화 그림자 효과 스타일 그리드 등록하기 기타 베리어블(투명도, 간격, 그림자) 등록 미션을 어떤 관점에서 접근했는지? 최대한 미션 목표에 맞춰서 작업을 했습니다. 강의를 튜토리얼 느낌으로 접근하면서 피그마랑 친해진 느낌을 받았습니다. 문제를 해결하는 과정은 무엇이었는지? 타이포그래피에서 생각지도 못하게 폰트가 없어서 폰트를 등록하는 방법을 검색하면서 문제를 해결했습니다. 아이콘 등록 부분도 깨져서 당황했지만, 앤트맨 방법을 계속 도전해 보니 성공해서 좋았습니다. 순간 아이콘을 하나씩 다 만들어버릴까? 라는 생각도 했습니다. 미션 해결에 대한 간단한 회고 피그마를 처음 접하면서 스터디를 시작 전에 기초 부분을 독학으로 공부한다고 했는데요.이번에 피그마가 업데이트가 되면서 인터페이스부 분을 너무 달라서 당황했지만, 쉬운 부분은 검색하면서 해결할 수 있어서 좋았습니다.
UX/UI
・
피그마
・
베리어블
・
디자이시스템
・
인프런워밍업클럽스터디2기