디자인 시스템11분
ERP 메뉴 스타일 정리: 화면을 찾아가는 여섯 가지 방식과 두 줄 툴바
입사 둘째 날인 영업 담당자가 수주를 넣으려고 ERP를 엽니다. 왼쪽 메뉴에는 영업관리, 구매관리, 재고관리, 생산관리가 있고, 영업관리를 펼치니 수주등록, 수주현황, 수주마감, 수주변경이력이 또 나옵니다. 옆자리 선임은 메뉴를 쓰지 않습니다. 검색창에 「수주」를 치고 엔터를 누릅니다.
입사 둘째 날인 영업 담당자가 수주를 넣으려고 ERP를 엽니다. 왼쪽 메뉴에는 영업관리, 구매관리, 재고관리, 생산관리가 있고, 영업관리를 펼치니 수주등록, 수주현황, 수주마감, 수주변경이력이 또 나옵니다. 옆자리 선임은 메뉴를 쓰지 않습니다. 검색창에 「수주」를 치고 엔터를 누릅니다.
회사 홈페이지에 색 테마를 붙였습니다. 다크·라이트는 이미 있었고, 거기에 색 팔레트를 고르는 축을 하나 더 얹는 일이었습니다.
좋은 웹사이트 기획은 화면을 많이 그리는 일이 아니라, 방문자가 해야 할 일을 콘텐츠와 구조로 명확하게 만드는 일이다. 이 글에서는 첫 코드를 작성하기 전에 목표, 사용자, 콘텐츠, 페이지 구조, URL, 접근성 기준을 하나의 실행 가능한 문서로 정리하는 방법을 다룬다.
웹 레이아웃은 화면을 몇 칸으로 나눌지 정하는 작업이 아닙니다. 콘텐츠의 읽기 순서를 먼저 세우고, 넓이가 달라져도 그 순서와 기능이 무너지지 않도록 공간의 규칙을 만드는 작업입니다.
디자인 시스템을 운영하다 보면 버튼, 컬러, 레이아웃보다 먼저 부딪히는 문제가 있습니다. 바로 이름입니다. 이름은 문서 구조, 패키지명, 컴포넌트 철학, 팀 내 커뮤니케이션에 계속 영향을 줍니다.
네오브루탈리즘은 최근 웹과 앱 디자인에서 자주 보이는 강한 시각 스타일입니다. 두꺼운 테두리, 원색, 딱딱한 그림자, 과감한 타이포그래피를 사용해 화면을 포스터처럼 보이게 만듭니다.
웹사이트나 앱을 만들 때 “어떤 느낌으로 디자인할 것인가”는 생각보다 중요한 결정입니다. 같은 기능이라도 시각 언어에 따라 신뢰감, 친근함, 전문성, 실험성이 완전히 달라집니다.