Figma 편집 기능

Figma 편집 기능 1. Figma 편집 기능 - Figma에서는 다양한 편집 기능이 존재 2. 코멘트 Tool - 코멘트를 남기는 기능 3. Hand Tool - 화면을 드래그해서 이동하는 기능 ※ 다른 Tool을 사용 중인 경우, Space 키를 누르고 있으면, Hand Tool이 유지 4. Text - 텍스트를 입력함 (오른쪽 속성 창에서 상세 설정 가능) 5. Pen Tool - 점을 찍어서, 선과 면을 만드는 기능 (모든 점을 이으면, 면이 생김) 6. Pencil - 선을 그리는 기능 7. Frame - 도형 or 텍스트 같은 모든 요소를 묶고 새로운 기준점을 만드는 기능 - 프레임 안에서 새로운 프레임 생성 가능 - 보통 프레임 안에서, 디자인 작업이 이뤄짐 8. Group - 다른 요소를..

• format_list_bulleted UI & UX/Figma
• · 2023. 7. 9.
• textsms

프로토타이핑(Prototyping)

프로토타이핑(Prototyping) 1. 프로토타이핑 - 디지털 제품의 아이디어 or 디자인 컨셉을 시뮬레이션하고 검증하기 위해 사용되는 과정 ※ 프로토 타입은 실제 UX를 시뮬레이션 하기 위해 구축된 모델 or 시스템 2. 장점 - 아이디어 검증 - 초기 아이디어의 유효성과 실행 가능성을 평가받고 피드백 받음 - 사용자 피드백 수집 - 사용자의 요구사항과 선호도를 이해하고 피드백을 수집함 - 협업과 의사소통 - 디자이너, 개발자, 이해관계자들 간의 의사소통과 협업을 원활하게 함 - 비용 절감 - 제품 개발 초기에 문제점을 발견하고 수정함으로써 추후에 발생할 수 있는 비용과 시간을 절감함 3. 프로토타입 도구 - Figma, Sketch, Adobe XD, InVision, Axure RP 등이 사용됨

• format_list_bulleted UI & UX/Figma
• · 2023. 7. 9.
• textsms

와이어 프레임(Wire Frame)

와이어 프레임(Wire Frame) 1. 와이어 프레임 - 디지털 제품의 구조와 레이아웃을 시각적으로 표현하는 것 - 디자인 단계에서 초기 아이디어를 시각화하고 공유하기 위해 사용 - 간단한 선과 기본적인 도형으로 구성 (실제 콘텐츠 or 디자인 요소들의 디테일은 제외) 2. 와이어 프레임의 장점 - 아이디어 시각화 - 디자이너와 개발자 간에 아이디어를 명확하게 공유하고, 이해하기 쉽게 만듦 - 레이아웃 설계 - 콘텐츠와 구성 요소들의 배치를 결정해, UX를 개선할 수 있음 - 사용자 흐름 분석 - 사용자의 상호작용과 페이지 이동 경로를 이해하고 테스트하기 위해 사용 - 개선과 반복 - 비교적 빠르게 수정이 가능해, 디자인 개선과 반복을 촉진함

• format_list_bulleted UI & UX/Figma
• · 2023. 7. 9.
• textsms

Figma

Figma 1. Figma - 웹 기반의 협업 디자인 플랫폼 - UI(User Interface) 디자인, UX(User Experience) 디자인, 프로토타입 제작을 위한 다양한 기능을 제공 - 웹 브라우저에서 작동하며, Windows, macOS 및 Linux 운영 체제를 지원 - 팀 멤버들과 실시간으로 디자인 파일을 공유하고 코멘트를 작성할 수 있는 기능을 제공

• format_list_bulleted UI & UX/Figma
• · 2023. 7. 9.
• textsms