-
TIL 260306 반응형 디자인 알아보기TIL 2026. 3. 9. 01:24
https://rnfltpgus.github.io/knowledge/responsive-web/fluid-grid/
가변 그리드(Fluid Grid)란?
다음 글 React - Suspense, lazy에 대해 잠깐
rnfltpgus.github.io
UI 생성 활용 AI
- Relume AI
- Galileo AI
- Visily
AI 다루기 [최고의 프롬프트 엔지니어링 강의] 책 참고
UX 설계 순서
1 문제 정의
2 IA (정보 구조)
3 User Flow (사용 흐름)
4 Wireframe (화면 구조)
5 UI 디자인
6 PrototypeIA 정보가 어떻게 정리돼 있지? (설계된 구조와 구조의 집합) sitemap IA 구조 설계 결과 전반 User Flow 사용자는 어떤 경로로 행동하지? (흐름) Wireframe 화면 구조는 어떻게 생겼지? (시안) UI 디자인은 어떻게 보이지? (디자인) IA와 userflow, navigation 개념의 혼동이 있어서 찾아본 자료
신입디자이너를 위한 IA 알아보기
들어가며 IA는 우리가 사용하는 모든 서비스가 가지고 있습니다. 그래서 새로운 서비스를 만들거나 기존 서비스를 개선할 때에도 중요한 부분인데요. 올 한 해 다양한 서비스의 IA를 설계하고 개
story.pxd.co.kr
기능배치의 원근법
르네상스 이래 원근법은 2차원의 평면에서 3차원의 입체를 표현하기 위한 기교로서 널리 활용되었는데, 시각적인 효과면에서 볼 때, 근경-중경-원경에 따른 시각적인 깊이감을 줌으로써 시선의
story.pxd.co.kr
https://m2.material.io/design/navigation/understanding-navigation.html#types-of-navigation
Material Design
Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams build high quality digital experiences.
m3.material.io
Jesse James Garrett가 정리한 인터랙션 디자인의 5가지 차원(5 Dimensions of Interaction Design)
1. 단어 - ux writing
2. 시각적 표현 - 모든 시각적 요소
3. 물리적 객체 또는 공간 - 화면 밖의 디바이스와 공간
4. 시간 - 시간에 따라 변화하는 요소 motion
5. 행동 - 사용자의 행동과 그에 대한 시스템의 반응
인터랙션 디자인의 주요 원리
'사용자는 바보다'
1. 피드백 - 진행 상황을 피드백
2. 일관성 - 같은 요소에는 같은 인터랙션
3. 가시성 - 사용자가 할 수 있는 행동을 '볼 수 있게'
4. 관용성 - 사용자에 대한 관용
5. 매핑 - intuition을 우선으로
트리거 와 인터랙션 ; 트리거는 어떤 행동이 발생했는지 정의하고, 이 행동에 대해 어떻게 반응할지 설정하는게 인터랙션이다.
오늘 배운 figma plugin
- responsive : 반응형이 여러 브레이크 포인트에서 어떻게 작동할지 실행해볼 수 있는 플러그인
'TIL' 카테고리의 다른 글
디자인 시스템 스터디 (0) 2026.07.05 UX writing 스터디 - 유저가 반응하는 광고 소재의 특징 (토스 애즈 참고) (0) 2026.06.24 TIL 260305 디자인 토큰, 멘토링 (0) 2026.03.09 TIL 260225 디자인 시스템 이해 (UI 디자인 중급) (0) 2026.03.09 TIL 260303 UI 디자인과 컴포넌트 알아보기 (0) 2026.03.03