ssoy_story

📖 내가 선정한 웹/앱 서비스의 디자인을 클론(clone)해봅니다. 이를 통해 피그마 기초 실력 향상과, 좋은 UI/UX에 대한 이해를 갖출 수 있습니다. 1. 선정했던 웹/앱 서비스에서 파트를 하나 선택한다. ex) 홈 화면, 결제, 장바구니 등등… 2. 해당 화면들을 모두 캡쳐하고, 피그마에 이미지를 삽입합니다. 3. 클론 디자인을 진행합니다. 4. 클론이 완료된 후에는, 내가 생각하는 개선 아이디어를 반영해 Before / After 디자인을 진행해봅니다. ### 강의에서 배운 내용을 사용해봅시다. --- 1. 자주 사용되는 부분은 컴포넌트로 만들어봅시다. 2. 유저 플로우를 그려봅시다. - 🗂 참고 아티클 [[사용자 친화 웹] Figma로 KREAM 어플 클론하기](https://velog.io/..

브레드 크럼(Breadcrumbs) 사이트 이동 경로라고 하며 사용자가 현재 어떤 위치에 있는지를 시각적으로 나타낸다. 토글(Toggle / Swich) 특정 기능을 켜고 끌 때 사용하며 주로 모바일에서 활용되며 스위치 와 많이 통용되고 있다, 튤팁(Tool Tip) 웹사이트에서 부연 설명을 사용되는 유용한 요소이며, 사용자가 개체 위에 포인트를 올려놓았을때 자용으로 표시된다. 텍스트 입력 필드 (Text Input Field) 앱 사용시 흔히 볼수 있는 키보드로 직접 텍스트를 입력하는 곳을 말한다. 플레이스 홀더(Placeholder) 사용자가 값을 입력하기 전에 도움을 줄 수 있는 힌트를 인풋 박스 안에 표시해주는 것을 말한다. 이때, 사용자가 값을 입력하면 문자는 사라진다. 플로팅 버튼 (Float..

이런 질문들을 가지고 접근해보기 지난 일주일 동안 가장 인상 깊었던 배움에는 뭐가 있었지? 그 배움까지 다가가는데 어떤 어려움이 있었지? 그 과정에서 나는 무엇을 깨달았고, 어떤 감정/생각이 들었었지? 결과적으로, 현재 나의 상태는 어떻게 되었지? 이 상태에서 다음 일주일을 더 잘 보내려면 무엇이 필요할까? Facts 피그마 프로토타입과 스마트애니메이션 제작법을 배웠다. UX/UI 관련 용어 및 아티클을 찾아보고 내용을 정리했다. 자주 사용하는 웹 서비스의 UI를 분석하고 클론디자인을 해보았다. ​ Feelings 강의에서 배우는 스킬들이 아직 익숙하지 않아서 많이 버벅거린다. 프레임을 제작할때 수정하면 계속 오류가 난다... 내가 못하는건지, 프로그램 오류인건지 바로바로 피드백을 받을 수 없는 부분이 ..

1주차 피그마 database ​ 1. 피그마 인터페이스 및 기본 도구: 캔버스(Canvas): 디자인 작업을 수행하는 메인 작업 영역. 도구바(Toolbar): 기본 도구들이 위치한 곳. 선택 도구, 그리기 도구 등이 있다. 레이어 리스트(Layers List): 요소들의 계층 구조를 보여주는 패널. 프로퍼티 패널(Properties Panel): 선택한 요소에 대한 속성을 편집할 수 있는 곳. 우측 사이드바(Right Sidebar): 페이지, 협업 기능, 히스토리 등이 있는 영역. ​ 성공 과정: 기본 도구를 사용하여 간단한 디자인 프로젝트를 진행하고, 그로부터 피드백을 받아 개선하는 과정을 통해 실력을 향상시킨다. ​ 2. 피그마의 플러그인과 커뮤니티: 플러그인(Plugins): 추가 기능을 통해..