2023. 11. 29. 18:53ㆍProduct 디자인
현재 회사에서 새로운 블록체인 관련 솔루션을 제작 중..
디자인을 하기 전 디자인 시스템을 제작하기로 했다.
먼저 컴포넌트를 만들기전 초기 가이드라인을 제작하는게 좋을것 같아
유명 서비스들의 기반을 찾아본다.
라인에서는 최소한의 디자인 규칙을 포함하는 디자인 요소의 가장 작은 단위이며 개발간의 소통을 원활하게 해주는 수단으로 활용된다.
Foundation
The foundation is the smallest unit of a design element that contains the minimal design rules.
designsystem.line.me
지마켓 디자인 시스템에서는 필수적인 시각적 요소라고 말하고 있다.
Typography - Gmarket Design System
G마켓의 브랜드 정체성, 사용성, 일관성을 고려한 디자인 시스템의 가이드라인을 소개합니다.
gds.gmarket.co.kr
구글 머터리얼 디자인에서는 광범위하고 세부적인 관점 모두에서 디자인을 다루는 기초라고 정의한다.
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
애플 디자인 시스템에서는 기본적인 디자인 요소라고 정의한다.
Foundations | Apple Developer Documentation
Understand how fundamental design elements help you create rich experiences.
developer.apple.com
BBC에서의 디자인 영역은 BBC 온라인이 구축되는 기반이라고 설명한다.
BBC GEL | Foundations
This guideline explains how to use typography across BBC online. It covers guidance on BBC Reith, and for teams still using Helvetica. Updates7 Aug 2017
www.bbc.co.uk
스카이 스캐너의 백팩은 제품의 시각적 구조적 가이드라인이라고 정의하고 있다.
Welcome to Backpack
Backpack is Skyscanner's design system, a collection of guidelines, components and tools for creating intuitive traveller-first experiences
www.skyscanner.design
이 외
SOCAR FRAME · zeroheight
socarframe.socar.kr
Spectrum, Adobe’s design system
Spectrum provides interface components, resources, and tools to help teams work more efficiently and to make applications more consistent.
spectrum.adobe.com
https://www.ibm.com/design/language/
www.ibm.com
이로써 Foundation 디자인 시스템의 가장 기초적인 단계로써
시각적, 구조적 요소의 가이드라인을 잡아주는 기반으로 설명 할 수 있다.
'Product 디자인' 카테고리의 다른 글
| [피그마] 왕초보 오토레이아웃(Auto layout)으로 반응형 카드(card) UI만들기 (0) | 2023.09.04 |
|---|---|
| [피그마] 왕초보 오토레이아웃(Auto layout)으로 리스트(list) 만들기 (0) | 2023.08.17 |
| [피그마] 왕초보 오토레이아웃(Auto layout)으로 Button 만들기 (0) | 2023.08.01 |
| 2023 iOS/AOS 스토어 스크린샷(스토어 이미지) 사이즈 (0) | 2023.07.31 |
| [피그마] 배리어블(Variable) 기능으로 라이트/다크모드 스위칭하기 (1) | 2023.07.12 |