본문 바로가기
반응형

분류 전체보기130

[Figma] Figma 개요 웹 디자인에 필요한 주요 기능은 다음과 같습니다:레이아웃 디자인: 페이지 구조를 정의하고 콘텐츠를 배치하는 작업타이포그래피: 텍스트 스타일을 설정하여 가독성을 높이는 작업색상 사용: 브랜드 아이덴티티를 반영하는 색상 팔레트를 사용하는 작업아이콘 및 이미지: 시각적 요소를 추가하여 디자인을 보완하는 작업네비게이션 설계: 사용자가 쉽게 탐색할 수 있도록 메뉴 및 링크를 설계하는 작업반응형 디자인: 다양한 디바이스에서 잘 보이도록 디자인하는 작업프로토타입: 사용자 경험을 테스트하기 위해 인터랙티브 모형을 만드는 작업피그마 사용법1. 레이아웃 디자인프레임 생성: F 키를 눌러 새로운 프레임을 생성합니다. 프레임은 페이지의 특정 섹션을 정의하는 데 사용됩니다.그리드 사용: 프레임을 선택하고 오른쪽 패널에서 Lay.. 2024. 6. 8.
[문서작성법] 단계별 문서 작성법(예시) 웹 디자인 및 모바일 디자인 프로젝트에서 문서 작성법을 단계별로 예시와 함께 상세하게 설명하겠습니다. 각 단계에서는 실제 프로젝트에서 사용하는 상황을 가정하여 문서를 작성해보겠습니다.1. 프로젝트 개요서 (Project Brief)목적프로젝트 개요서는 프로젝트의 전반적인 목적과 목표를 설명하며, 팀원들이 프로젝트의 방향성을 이해할 수 있도록 합니다.예시프로젝트 이름: GreenLife 웹사이트 리뉴얼프로젝트 개요:GreenLife는 환경 보호를 목적으로 하는 비영리 단체입니다. 이번 프로젝트는 GreenLife 웹사이트를 리뉴얼하여 사용자 경험을 개선하고, 기부자와 자원봉사자들의 참여를 촉진하는 것을 목표로 합니다.타겟 사용자:환경 보호에 관심이 있는 일반인기부자자원봉사자주요 목표:사용자 친화적인 인터페.. 2024. 6. 8.
[문서작성법] 단계별 문서 작성법(상세) 웹 디자인 및 모바일 디자인 프로젝트에서 문서를 단계별로 작성하는 과정을 상세히 설명하겠습니다. 각 단계에서는 실제 프로젝트에서 사용하는 상황을 가정하여 문서를 작성해보겠습니다.1. 프로젝트 개요서 (Project Brief)목적프로젝트 개요서는 프로젝트의 전반적인 목적과 목표를 설명하며, 팀원들이 프로젝트의 방향성을 이해할 수 있도록 합니다.작성법1.1 프로젝트 개요 작성프로젝트 이름: GreenLife 웹사이트 리뉴얼프로젝트 개요: GreenLife는 환경 보호를 목적으로 하는 비영리 단체입니다. 이번 프로젝트는 GreenLife 웹사이트를 리뉴얼하여 사용자 경험을 개선하고, 기부자와 자원봉사자들의 참여를 촉진하는 것을 목표로 합니다.1.2 타겟 사용자 정의타겟 사용자:환경 보호에 관심이 있는 일반인.. 2024. 6. 8.
[UX/UI Design] 주요 도구 웹 디자인과 모바일 디자인 분야에서 주로 사용하는 도구는 다음과 같습니다. 1. 디자인 도구Sketch주로 웹 및 모바일 UI/UX 디자인에 사용벡터 그래픽 기반의 인터페이스 디자인에 최적화다양한 플러그인 및 협업 기능 제공Figma클라우드 기반의 디자인 도구로, 실시간 협업 가능프로토타이핑 및 디자인 시스템 관리 기능다양한 플러그인 지원Adobe XDAdobe Creative Cloud 제품군의 일부로, UX/UI 디자인 및 프로토타이핑 도구벡터 디자인과 인터랙티브 프로토타입을 손쉽게 제작 가능디자인 사양을 개발자와 쉽게 공유2. 프로토타이핑 도구InVision디자인 파일을 인터랙티브 프로토타입으로 변환클라이언트 및 팀원과 피드백 공유 및 협업 가능다양한 사용자 테스트 기능 제공Marvel간단한 인터페.. 2024. 6. 8.
[문서작성법] 단계별 문서 작성법(개요) 웹 디자인이나 모바일 디자인 분야에서 문서 작성은 프로젝트의 성공적인 진행을 위해 매우 중요합니다. 이러한 문서들은 디자인 팀과 개발 팀, 그리고 클라이언트 간의 원활한 커뮤니케이션을 돕고 프로젝트 요구사항과 목표를 명확히 합니다. 웹 및 모바일 디자인 문서를 작성할 때는 다음과 같은 주요 문서 유형과 작성법을 참고할 수 있습니다.1. 프로젝트 개요서 (Project Brief)목적: 프로젝트의 전반적인 목적과 목표를 설명합니다.내용:프로젝트 개요타겟 사용자주요 목표성공 지표2. 요구사항 정의서 (Requirements Specification)목적: 프로젝트의 기능적 및 비기능적 요구사항을 명확히 합니다.내용:기능적 요구사항: 사용자가 수행할 수 있는 주요 기능들 (예: 사용자 등록, 로그인, 제품 검.. 2024. 6. 8.
[UX/UI Design] 6단계: 포트폴리오 제작 6단계: 포트폴리오 제작학습 목표:포트폴리오 구성 방법 배우기작품 설명 및 프로세스 문서화세부 학습 내용:1. 포트폴리오 구성 방법 배우기학습 목표:포트폴리오의 중요성 및 구성 요소 이해효과적인 포트폴리오 구성 방법 학습학습 자료:온라인 자료:BehanceDribbbleMedium의 UX 관련 블로그예제 포트폴리오:인터넷에서 검색하여 다양한 UX/UI 포트폴리오 사례 참고세부 학습 과정:포트폴리오의 목적과 중요성 이해포트폴리오의 필수 구성 요소 학습 (소개, 프로젝트, 프로세스 설명, 결과물 등)포트폴리오의 레이아웃 및 디자인 원칙 이해실습:포트폴리오 구성 요소 정리포트폴리오의 기본 레이아웃 설계문서화 예시:# 포트폴리오 구성 문서## 포트폴리오 개요- 포트폴리오의 목적: [목적 설명]- 주요 구성 요소.. 2024. 6. 8.
[UX/UI Design] 5단계: 프로젝트 수행 및 피드백 받기 5단계: 프로젝트 수행 및 피드백 받기학습 목표:프로젝트 기획 및 실행피드백 수집 및 반영세부 학습 내용:1. 프로젝트 기획 및 실행학습 목표:UX/UI 디자인 프로젝트의 전반적인 기획과 실행 과정 이해실무 프로젝트 경험 쌓기학습 자료:온라인 자료:UX Design.ccNielsen Norman Group예제 프로젝트:인터넷에서 검색하여 다양한 UX/UI 프로젝트 사례 참고세부 학습 과정:프로젝트 주제 선정 및 기획프로젝트 목표 및 범위 설정타임라인 및 주요 마일스톤 설정실습:프로젝트 주제 선정 (예: 특정 앱의 UX/UI 개선)프로젝트 목표 및 범위 설정타임라인 작성 및 주요 마일스톤 설정문서화 예시:# 프로젝트 기획 문서## 프로젝트 개요- 프로젝트명: [프로젝트명]- 작성자: [작성자 이름]- 작성.. 2024. 6. 8.
[UX/UI Design] 4단계: UX/UI 디자인 문서 작성법 배우기 4단계: UX/UI 디자인 문서 작성법 배우기학습 목표:UX 리서치 문서 작성법 배우기사용자 시나리오 및 페르소나 작성UI 디자인 가이드라인 문서화세부 학습 내용:1. UX 리서치 문서 작성법 배우기학습 목표:UX 리서치의 중요성 및 기본 개념 이해사용자 조사 및 리서치 문서 작성 방법 학습학습 자료:온라인 자료:Nielsen Norman GroupUX Design.cc예제 문서:인터넷에서 검색하여 다양한 UX 리서치 문서 참고세부 학습 과정:UX 리서치의 중요성 이해사용자 인터뷰, 설문조사, 사용성 테스트 등의 방법 학습리서치 문서 작성 방법 및 구성 요소 이해실습:간단한 사용자 리서치 설계 및 실시리서치 결과를 정리하여 리서치 보고서 작성문서화 예시:# UX 리서치 문서## 프로젝트 개요- 프로젝트명.. 2024. 6. 8.
[UX/UI Design] 3단계: PowerPoint를 활용한 디자인 3단계: PowerPoint를 활용한 디자인학습 목표:프레젠테이션 디자인 원칙 배우기타이포그래피와 색상 조합 이해스토리보드 제작세부 학습 내용:1. 프레젠테이션 디자인 원칙 배우기학습 목표:효과적인 프레젠테이션 디자인 원칙 이해시각적 정보 전달 방법 학습학습 자료:Microsoft PowerPoint 튜토리얼:Microsoft PowerPoint 공식 튜토리얼YouTube 강의:다양한 PowerPoint 디자인 강의 (예: "PowerPoint Design Tips and Tricks")세부 학습 과정:프레젠테이션의 목적과 청중 분석정보의 시각적 계층 구조 이해슬라이드 레이아웃 및 디자인 원칙 학습 (간결함, 일관성, 시각적 균형 등)실습:PowerPoint를 사용하여 간단한 프레젠테이션 슬라이드 제작각.. 2024. 6. 8.
[UX/UI Design] 2단계: Figma 기본 사용법 익히기 2단계: Figma 기본 사용법 익히기학습 목표:Figma 인터페이스 이해와이어프레임 제작 방법 배우기프로토타입 제작세부 학습 내용:1. Figma 인터페이스 이해학습 목표:Figma의 기본 인터페이스와 주요 기능 이해도구와 패널 사용법 학습학습 자료:Figma 공식 튜토리얼:Figma 공식 튜토리얼YouTube 강의:다양한 Figma 튜토리얼 (예: "Figma for Beginners" 시리즈)세부 학습 과정:Figma 인터페이스 구성 요소 이해 (패널, 도구바, 캔버스 등)기본 도구 사용법 학습 (직선, 사각형, 텍스트 등)레이어와 그룹 관리 방법 학습실습:Figma에 접속하여 새로운 프로젝트 생성기본 도구를 사용하여 간단한 도형과 텍스트 추가레이어와 그룹을 활용하여 요소 정리문서화 예시:# Fig.. 2024. 6. 8.
반응형

티스토리툴바