IndexStyle

작품 자체에서 써 내려간 디자인 양식 사전.

순수한 HTML이다.어떤 브라우저에서도 어떤 기기에서도앱이나 계정 없이 열리고,기계도 같은 페이지를 그대로 읽는다.

항목776

사전

스타일 이름이나 만들고 싶은 것을 검색하세요. 이름 일치를 우선하고 용도, 인상, 매체로 가까운 대안을 더합니다.

예시바우하우스고급스러운 채용 사이트신뢰할 수 있는 금융 앱

24/776건 표시

385

Player Piano Roll — 자동 피아노 롤 (CC BY-SA 4.0) · © Draconichiaro

Player Piano Roll

自動ピアノロール / 1896–1930s / 양식 / 기보 체계

뚫린 구멍이 곧 연주가 되는 두루마리 종이의 매체. 사람이 읽는 악보에서 기계가 읽는 부호로 넘어간 전환점이자, 천공 카드와 디지털 시퀀서의 조상이다.

줄지어 뚫린 구멍 / 감겨 돌아가는 롤 / 기계가 읽는 음악 / 물리적으로 기록된 연주

design.md이미지 프롬프트

386

Spectrogram — 새소리 스펙트로그램 — Wikimedia Commons / Public domain

Spectrogram

スペクトログラム / 1940s– / 기법 / 도해와 도식

소리를 시간·주파수·강도의 평면 위에 옮겨 놓은 그림. 새소리 연구에서 DAW 화면까지, 소리의 형태를 보는 표준적인 방식이며, 그 안에 그림을 숨기는 작가들까지 딸려 있다.

시간-주파수 평면 / 농담으로 나타낸 강도 / 성문(聲紋)의 무늬 / 그림 숨기기 놀이

design.md이미지 프롬프트

387

Cymatics — 클라드니 판의 무늬 (CC BY-SA 4.0) · © Exhibit made by Estes Objethos Atelier, photo by Rodrigo Tetsuo Argenton

Cymatics

サイマティクス / 1787– / 기법 / 도해와 도식

진동하는 판 위의 모래가 그리는 클라드니 도형에서 시작된, 소리를 물질의 무늬로 보는 실험이다. 주파수마다 다른 기하학이 떠오르니, 소리와 형태의 대응을 목격하게 하는 가장 오래된 가시화 장치다.

클라드니 도형 / 모래와 가루에 생기는 정상파 / 주파수마다 하나의 무늬 / 장치의 직접성

design.md이미지 프롬프트

388

Labanotation — ラバノーテーションによる譜 — Wikimedia Commons / CC BY-SA 4.0 · © Raphaël Cottin

Labanotation

ラバノーテーション / 1928– / 양식 / 기보 체계

몸의 움직임을 아래에서 위로 읽는 하나의 세로 기둥으로 옮겨 적는 기보법이다. 기호의 모양이 방향을, 짙고 옅음이 높이를, 길이가 지속 시간을 맡고, 기둥을 가로지르는 위치가 어느 부위의 움직임인지를 가리킨다.

아래에서 위로 읽는 세로 기둥에 기호가 빈틈없이 쌓인다 / 기호의 모양이 아홉 방향을 가리키고, 중심선의 좌우가 몸의 좌우를 나눈다 / 기호 안쪽의 짙고 옅음이 낮음과 중간과 높음의 세 단을 나타낸다 / 기호의 길이가 그대로 지속 시간이 되고, 박의 눈금과 마디선이 기둥을 가로지른다

design.md이미지 프롬프트

389

Origami Diagram — 종이접기 전개도 (CC BY 4.0) · © Nicoguaro

Origami Diagram

折り図 / 1950s– / 양식 / 도해와 도식

입체적인 접기를 평면의 지면에 적기 위해 요시자와 아키라가 체계화한 점선과 화살표의 언어. 산접기와 골접기는 언어를 넘어 읽히고, 전개도는 수학의 대상이 되었다.

산접기와 골접기의 선 종류 / 각 단계를 이끄는 화살표 / 차례를 따르는 공정 도해 / 전개도의 기하학

design.md이미지 프롬프트

390

Knitting Chart — 마리 니드너 / 구시 폰 레덴 『Beyers Handarbeitsbücher 45: Kunst-Stricken I』의 뜨개 기호 1921 — Wikimedia Commons / Public domain

Knitting Chart

編み図 / 19th century– / 양식 / 기보 체계

코를 기호로 바꾸어 격자에 늘어놓는 수예의 악보다. 일본의 JIS 뜨개 기호는 한 코의 동작을 도형 하나로 압축해, 문장으로 풀어 쓰는 서구식과 대조되는 읽기 전에 보이는 설계를 이루었다.

뜨개 기호의 격자 / 한 코에 기호 하나 / 단과 코의 좌표 / 완성된 편물과의 대응

design.md이미지 프롬프트

391

Braille — 점자 이전의 양각 문자 6방식 — Wikimedia Commons / Public domain

Braille

点字 / 1824– / 양식 / 기호 체계

루이 브라유가 열다섯 살에 설계한, 2×3의 점으로 모든 글자를 나타내는 촉각 문자 체계다. 손끝 하나에 들어오도록 셀의 치수를 정한 설계는 인간공학과 타이포그래피가 일치한 드문 발명이다.

2×3의 점 칸 / 손끝에 맞춘 치수 / 왼쪽에서 오른쪽으로 읽는 촉독 / 돋을새김의 물성

design.md이미지 프롬프트

392

Signal Flags — 국제 신호기 일람 — Wikimedia Commons / Public domain

Signal Flags

国際信号旗 / 1857– / 양식 / 기호 체계

바다에서 글자와 관용 문구를 표기하는 깃발 체계. 오직 먼 거리에서의 판독성만을 기준으로 고른 고대비 기하학이, 기능에서 태어난 추상의 걸작 모음이 되었다.

고대비의 기하학 / 거리를 위해 설계된 형태 / 깃발 하나에 글자 하나 / 마스트 꼭대기까지 잇대어 올린 게양

design.md이미지 프롬프트

393

Weather Map — 지상 일기도 1947 — Wikimedia Commons / Public domain

Weather Map

天気図 / 1851– / 양식 / 도해와 도식

등압선과 전선 기호, 일기 기호로 대기를 한 장에 그려낸 그림. 보이지 않는 기압장을 곡선의 밀도로 드러내면서, 신문에서 텔레비전까지 대중이 보는 과학 그래픽이 되었다.

등압선의 밀도 / 한랭전선과 온난전선 기호 / 일기 기호 체계 / 표기된 고기압과 저기압

design.md이미지 프롬프트

394

Circuit Diagram — 라디오 수신기 회로도 1920 — Wikimedia Commons / Public domain

Circuit Diagram

回路図 / 1890s– / 양식 / 도해와 도식

전기 회로를 규격화된 기호와 직교하는 선으로 그리는 공학의 언어다. 물리적 배치를 버리고 연결 관계만을 옮기는 추상화는 노선도보다 앞선 위상학의 도법이었다.

표준화된 소자 기호 / 직교하는 배선 / 접속점 / 물리적 배치로부터의 추상

design.md이미지 프롬프트

395

Flowchart — 길브레스의 공정도 기호 1921 — Wikimedia Commons / Public domain

Flowchart

フローチャート / 1921– / 레이아웃 / 도해와 도식

길브레스 부부가 작업 분석을 위해 고안한 공정도. 마름모는 판단, 직사각형은 처리라는 도형의 문법은 프로그래밍을 거치며 단계로 사고하는 일의 공용어가 되었다.

도형의 문법 / 판단의 마름모 / 흐름의 화살표 / 시작과 끝의 단말 기호

design.md이미지 프롬프트

396

Care Symbols — 취급 표시 라벨 — Wikimedia Commons / Public domain

Care Symbols

洗濯表示 / 1958– / 양식 / 기호 체계

대야·삼각형·사각형·원, 네 도형으로 국경을 넘는 기호 체계. 세탁과 표백, 건조와 다림질을 몇 밀리미터의 라벨에 압축한 최소 면적의 정보 디자인이다.

대야와 삼각형, 사각형과 원 / 금지의 가위표와 온도를 나타내는 점 / 밀리미터 단위로의 압축 / 국제 표준화

design.md이미지 프롬프트

397

Alchemical Symbols — 화학·철학 기호표 17세기 — Wikimedia Commons / Public domain

Alchemical Symbols

錬金術記号 / medieval–18th century / 양식 / 기호 체계

비밀과 공유 사이에서 물질과 조작을 기록하던 기호. 행성과 금속을 잇던 이 체계는 화학 기호 속으로 사라졌지만, 신비의 그래픽으로 남아 오늘날까지 인용된다.

행성과 금속의 대응 / 십자로 조합한 기하학 / 암호에 가까운 비밀주의 / 전해 내려온 대조표

design.md이미지 프롬프트

398

Proofreading Marks — 교정 부호로 표시한 교정지 — Wikimedia Commons / Public domain

Proofreading Marks

校正記号 / 16th century– / 기법 / 기호 체계

조판된 지면의 오류를 여백과의 대화로 바로잡는 기호의 언어다. 지움과 되살림의 왕복, 서구의 dele 기호처럼 인쇄의 역사와 함께 다듬어진 이 지면 위의 편집 프로토콜은 이 사전을 포함한 모든 조판물 뒤에 있다.

본문과 여백을 잇는 인출선 / 지움과 되살림의 주고받음 / 삽입과 자리바꿈 기호 / 붉은색의 위계

design.md이미지 프롬프트

399

Aqua — Mac OS X의 Aqua 대화 상자 2007 — Wikimedia Commons / Public domain

Aqua

アクア / 2000–2014 / 양식 / 애플 UI

맥 OS X가 내세운 ‘핥고 싶어지는 버튼’의 디자인 언어다. 젤리 같은 광택과 핀스트라이프, 깊은 그림자와 지니 효과가 디지털 부품을 만질 수 있는 사물로 연출하며 2000년대 UI 전반을 규정했다. 이것을 이미지로 흉내 낸 당시의 웹이 바로 Web 2.0 Gloss다.

젤처럼 광택 나는 버튼 / 핀스트라이프 바탕 / 깊은 드롭 섀도 / 물과 빛의 은유

design.md이미지 프롬프트

400

Luna — Windows XP의 시작 메뉴와 작업 표시줄 2006 — Wikimedia Commons / CC BY-SA 2.5 · © Mickfuzz at English Wikibooks

Luna

ルナ / 2001–2006 / 양식 / 마이크로소프트 UI

윈도우 XP의 외관. 파란 작업 표시줄과 초록 시작 버튼, 둥근 창, 그리고 초원 배경화면이 잿빛 사무기기를 가정적인 낙관으로 다시 칠했다.

파란 작업 표시줄 / 초록 시작 버튼 / 둥근 프레임 / 초원과 하늘의 낙관

design.md이미지 프롬프트

401

Aero — Windows Vista의 Aero 합성으로 표시된 PuTTY 2009 — Wikimedia Commons / CC BY-SA 3.0 · © Lanman132

Aero

エアロ / 2006–2012 / 양식 / 마이크로소프트 UI

비스타와 7의 반투명 유리 UI. 간유리 창틀과 실시간 축소판, GPU로 합성한 깊이가 '유리 너머로 본다'를 운영체제의 표준 어휘로 만들었다.

간유리 창틀 / 반사와 하이라이트 / 실시간 축소판 / GPU로 합성한 깊이

design.md이미지 프롬프트

402

Metro — Microsoft 『Zune HD』의 라디오 화면 — Wikimedia Commons / CC BY-SA 2.0 · © Manimecker

Metro

メトロ / 2010–2015 / 양식 / 마이크로소프트 UI

아이콘보다 글자를 주인공으로 세운 윈도우폰의 플랫 언어다. 큰 타이포그래피와 단색 라이브 타일, 화면 끝을 지나쳐 흐르는 구성이 교통 사인의 명료함을 UI로 옮겨 와, iOS 7보다 앞서 플랫 시대를 열었다.

주인공이 된 글자 / 단색 타일 / 화면 밖으로 이어지는 구성 / 제거된 크롬

design.md이미지 프롬프트

403

Brushed Metal — Transmission 1.50 화면 2009 — Wikimedia Commons / CC BY-SA 3.0 · © Alv

Brushed Metal

ブラシドメタル / 1999–2007 / 양식 / 애플 UI

아이튠즈와 사파리의 헤어라인 메탈 창. 재질로 앱의 용도를 말하는 스큐어모피즘의 한 갈래로, 전문 장비의 신뢰감을 데스크톱으로 끌어왔다.

헤어라인 메탈 표면 / 리벳을 닮은 디테일 / 장비의 메타포 / 회색 계조

design.md이미지 프롬프트

404

Vorticism — 『BLAST』 창간호 1914 — Wikimedia Commons / Public domain

Vorticism

ヴォーティシズム / 1914–1918 / 양식 / 아방가르드

잡지 《BLAST》에서 폭발한 영국의 아방가르드. 기계로 잘라낸 듯한 사선, 무디고 굵은 활자, 저주와 축복의 목록이 타이포그래피를 선전포고로 바꾸어 놓았다.

기계로 잘라낸 듯한 사선 / 무디고 굵은 활자 / BLAST/BLESS 목록 / 소용돌이의 역학

design.md이미지 프롬프트

405

CoBrA — 카렐 아펠 유리 벽화 (암스테르담 슬로테르파르트 병원) — Wikimedia Commons / CC BY-SA 4.0 · © Ceescamel

CoBrA

コブラ / 1948–1951 / 양식 / 아방가르드

코펜하겐과 브뤼셀, 암스테르담을 잇는 전후 아방가르드다. 아이들 그림과 민속 예술의 직접성을 내걸고 거친 붓질과 원색의 생물들을 그리며, 세련됨에 대한 불신을 하나의 국제 양식으로 만들었다.

아이들 그림의 직접성 / 거칠게 칠한 생물들 / 충돌하는 원색 / 계획을 거부하는 태도

design.md이미지 프롬프트

406

Emigre — 주자나 리츠코 『Filosofia』 1996 — Wikimedia Commons / CC BY-SA 4.0 · © Kateallalong

Emigre

エミグレ / 1984–2005 / 양식 / 서체 분류

매킨토시가 등장하자마자 디지털의 거칢을 미학으로 바꾸어 놓은 잡지이자 활자 회사. 비트맵 서체, 충돌하는 레이어, 그리고 '읽기 어려움'에 대한 옹호로 1990년대 디자인 논쟁의 한복판에 섰다.

비트맵 서체 / 충돌하는 레이어 / 호마다 하나씩의 실험 / 가독성을 향한 도발

design.md이미지 프롬프트

407

Modern American Book Jacket — 러스티그 『구토』 표지 (CC BY 2.0) · © Karen Horton, diseño de la cubierta de Alvin Lustig, The New Classics Series publicado por New Directions, c. 1952

Modern American Book Jacket

アメリカ近代ブックジャケット / 1940s–1950s / 양식 / 출판과 편집

러스티그가 뉴 디렉션스에서 세운 재킷 양식. 삽화 대신 기호와 추상으로 내용을 암시해 문학서 표지를 작은 모던 아트로 바꾸고 전후 미국의 북디자인 수준을 끌어올렸다.

내용의 추상적 암시 / 기호와 형태의 구성 / 손글씨와 활자의 병용 / 시리즈 전체의 일관성

design.md이미지 프롬프트

408

Onchi Kōshirō Book Design — 고바야시 다키지 『게 가공선』 센키샤판 표지 1929 — Wikimedia Commons / CC0

Onchi Kōshirō Book Design

恩地孝四郎の装幀 / 1910s–1950s / 양식 / 출판과 편집

표지를 그림을 담는 틀이 아니라 한 장의 판화로 다루는 장정이다. 구상 삽화를 놓지 않고 추상의 형과 색면을 찍으며, 제목의 글자도 그 면의 일부로 놓는다.

구상 삽화를 놓지 않고 추상의 형과 색면만으로 표지를 짠다 / 제목의 글자를 활자로 짜지 않고 손으로 그려 그림과 같은 면에 놓는다 / 색 수를 줄이고 윤곽선을 긋지 않은 채 면의 겹침으로 형을 만든다 / 종이 바탕의 색을 칠하지 않고 남겨, 그 위에 그림을 곧바로 올린다

design.md이미지 프롬프트

편집 방침

IndexStyle은 디자인 주변의 모든 용어를 싣지 않습니다. 독립 항목은 알아볼 수 있고 재현할 수 있으며 이웃 양식과 구별되는 시각 언어여야 합니다. 수록 기준

맨 위로