본문으로 건너뛰기
cccskills

Dembrandt

@dembrandt

조직

Extract Design Systems Instantly From Any Url

스킬 45개저장소 1개 151

스킬(45)

검색에서 좁히기

Settings for experts who are not developers — domain language, sane defaults, grouping by professional concept. Use when designing settings panels, solver configuration or constraint editors.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Naming, navigation, a UI that mirrors the data model, confirms for irreversible changes. Use when structuring a large application or naming its entities.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Spinners, skeletons and staggered reveals that manage wait times. Use when designing loading states, async data or the feel of a slow interface.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Small purposeful animations — toggles, animated icons, success moments. Use when designing interactive feedback, success states or loaders.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Modals, drawers, bottom sheets and popovers, each with its scope and blocking level. Use when designing dialogs, confirmations, side panels or action sheets.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Ratio-based type scale where every size relates to the others. Use when defining font sizes or type tokens, or when typography feels arbitrary.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Disney's animation principles and cinematic technique applied to UI motion. Use when designing transitions, scroll animations or onboarding motion.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Nielsen's 10 usability heuristics. Use when auditing an interface, designing interaction flows, writing error messages or reviewing usability.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Dense, linear, status-at-a-glance UI for specialists who use a tool all day. Use when designing dispatch, warehouse, logistics, scheduling or other B2B operations tools.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Lighthouse audits and Core Web Vitals — LCP, CLS, INP. Use when optimising page load, layout shift, input delay, images, fonts or render-blocking resources.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Mobile, tablet and desktop are different paradigms, not one layout scaled. Use when designing responsive layouts or deciding what each breakpoint shows.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Show where the user is and what their actions affect — breadcrumbs, regions, scope labels. Use when designing deep navigation or multi-section layouts.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Match information density to platform and user type. Use when designing data tables, dashboards or toolbars, or adapting a desktop product for mobile.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Size, colour, weight and position mark what matters most. Use when designing button groups, CTAs, cards, dashboards or any layout with a primary action.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Semantic HTML5, SEO basics, alt text, progressive enhancement and SPA concerns. Use when building web UI, reviewing markup or optimising for search.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Tabs swap views under a shared context. Use when designing tabbed layouts, settings pages, detail views or dashboards with several data views.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Helper text, placeholders, validation and submit behaviour. Use when designing or reviewing a form, input field or data entry UI.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Shadows and layering that lift elements above the surface. Use when designing cards, dropdowns, modals, tooltips or any floating element.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Set a surface apart by one means — border, elevation or fill — and keep opacity for state. Use when designing cards, panels, list rows, toolbars or any container.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

WCAG 2.2 AA compliance as required by the European Accessibility Act. Use when designing, building or reviewing any user-facing interface for accessibility.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

Buttons, inputs, badges and pills share radius, colour logic, shadow, border and spacing. Use when building or reviewing a component library.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

dembrandt/dembrandt-skills1512026년 10월 22일 업데이트

본인 계정인가요? GitHub를 연동하면 크리에이터 페이지에 모을 수 있습니다 (일본어)