Shopify Polaris
Shopify Polaris / 2017– / 양식 / 플랫폼 화면 언어
Shopify의 UI 프레임워크는 상품, 주문, 결제, 고객을 하나의 상거래 언어로 통일한다. 카드와 섹션이 판단을 나누고, 짧은 상태 및 행동 문구가 상점 운영의 다음 단계를 분명히 한다.
한눈에 판단
시각적 특징
- 옅은 바탕 위에 쌓인 흰색 카드
- 성공이나 전진을 알리는 신호로 쓰이는 초록색
- 제목, 상태, 주요 행동을 페이지 위쪽에 모은 구성
- 상품, 주문, 결제 상태를 나타내는 작은 배지
적합한 용도
- Management screens that connect order status to the next operational action
- Giving business tools a calm, humane voice without losing rigor
이 양식 사용하기
짧은 지침을 프로젝트에 적용하거나 구조화된 사양을 AI 도구에 넘길 수 있습니다.
자세한 제작법과 출처제작 규칙, 실제 사례, 비교, 연구, 인용 형식
사전 항목
- 타이포그래피
- Lead with the page title and primary action; split status and explanation into badge and body text.
- 구성
- Stack white cards on a pale ground, with one business decision per card.
- 재료
- Use neutrals as the base, green for success and progress, and red only for danger.
- 주의
- Putting everything in a card removes the order of the page. Define the workflow and primary action outside the cards first.
- 더 읽을거리
- Shopify admin page structure / Commerce status labels / Polaris as Web Components
관련 항목
- Atlassian Design System (Atlassian Design System)같은 계열: 플랫폼 화면 언어.Shopify Polaris와 Atlassian Design System 비교
- Bento Grid (ベントーグリッド)공통 인상: Trust / Intimacy / Technique.Shopify Polaris와 Bento Grid 비교
플랫폼 화면 언어 더 보기
플랫폼 화면 언어에서 공통 인상이 많은 항목을 우선해 골랐습니다.
- Salesforce Lightning Design System (Salesforce Lightning)공통 인상: Trust / Technique / Intimacy.
- Ubuntu Yaru (Ubuntu Yaru)공통 인상: Technique / Intimacy / Trust.
- Motif (モチーフ)공통 인상: Technique / Trust.
이 항목을 인용하기
사전은 링크되기 위해 있다. 글을 쓰는 자리에 맞는 형식을 그대로 가져가면 된다.
- Link
- https://indexstyle.org/ko/styles/shopify-polaris
- Markdown
- [Shopify Polaris — IndexStyle](https://indexstyle.org/ko/styles/shopify-polaris)
- HTML
- <a href="https://indexstyle.org/ko/styles/shopify-polaris">Shopify Polaris — IndexStyle</a>