IndexStyle

一部从作品本身写起的设计风格辞典。

它是纯粹的 HTML。任何浏览器、任何设备都能打开,不需要应用也不需要账号,机器读到的也是同一个页面。

词条776

辞典

可以按风格名搜索,也可以描述要做的东西。 名称匹配优先,再按用途、感受与媒介补充相近选择。

示例包豪斯高级感的招聘网站可信的金融应用

24/776 条

529

Gustavian Style — 斯图勒霍夫庄园 绿厅 1781年 — Wikimedia Commons / CC BY-SA 4.0 · © Holger.Ellgaard

Gustavian Style

グスタヴィアン様式 / 1770s–1790s / 风格 / 家具与室内

在古斯塔夫三世治下形成的瑞典新古典。范本是路易十六样式的形式化古典主义,国王曾造访凡尔赛,并把法国工匠请到宫廷。只是昂贵的材料被换成了本国产的玻璃。

克制的新古典轮廓,直接照搬路易十六样式的形。 / 水晶的坠饰被换成小颗的透明玻璃珠。 / 钴蓝色的玻璃只少量地掺进透明玻璃之中。 / 镀金的金属件与链条作为串起玻璃的骨架露在外面。

design.md图像提示词

530

Droog — Marcel Wanders《Knotted Chair》1996年 — Wikimedia Commons / CC BY 4.0 · © Sandra Fauconnier

Droog

ドローホ / 1990s– / 风格 / 家具与室内

指1990年代荷兰一批设计师聚在一起时自称的造型方式,droog 在荷兰语里是干的意思。废弃的抽屉、绳结这类常见之物直接充当结构,不用表面处理把它们藏起来。它把朴素和机智变成共同的样式,因而与同时期打磨光洁的工业设计分道扬镳。

来源不同的现成部件被捆成一件家具,颜色和磨损都不做统一 / 看似临时固定的带子和绳索,就这样留作最终的结构 / 材料的加工过程留在成品表面,绳结和接缝都不打磨掉 / 同一个设计每次用到的部件都不同,因此没有两件完全一样

design.md图像提示词

531

Machine Art — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Machine Art

マシン・アート / 1934 / 风格 / 近代设计运动

1934年纽约现代艺术博物馆举办的一场展览的名称。弹簧、锅具、仪表这类批量生产的实用品被放上基座,按雕塑的规格来展示。展厅是把十九世纪褐砂石建筑的线脚遮盖起来重新搭建的,让无装饰之物以无装饰的样子呈现,正是这次展览的条件。

基座之上,实用的量产部件一件一件拉开间距摆放 / 墙面和天花的线脚被遮住,背景的平面上没有任何纹样 / 展品是弹簧、锅具、仪表这类原本并非为观看而造的东西 / 作者一栏里排着的不是人名,而是制造公司的名字

design.md图像提示词

532

Xerox Star Interface — Xerox 8010 Star(ViewPoint)的桌面与图标 — Wikimedia Commons / CC BY 2.0 · © J R

Xerox Star Interface

ゼロックス・スター・インターフェース / 1981–1990s / 风格 / 平台界面语言

1981年 Xerox 8010 的画面所确立的设计语言。文件夹、收发文篮、文件抽屉这类办公用品被画成带文字标签的图像排在屏幕上,当时的宣传册称之为电子桌面。画面上的东西可以用鼠标随意移动、复制和丢弃。

画面上的图像一定配有文字标签,不让图形单独承担意义 / 图像画的是办公桌上的东西,文件夹、收发文篮、文件抽屉 / 用鼠标抓取物件,移动、复制和删除属于同一套动作 / 电子表格表现为行与列的网格,操作网格的命令统一收进菜单

design.md图像提示词

533

PLATO Terminal Screen — PLATO V 终端的等离子屏幕 1981年 — Wikimedia Commons / CC BY 3.0 · © Mtnman79 [1]

PLATO Terminal Screen

PLATO端末の画面 / 1972–1980s / 风格 / 平台界面语言

伊利诺伊大学在1960年代初开始的教育网络 PLATO 的画面。在等离子平面板和可触摸的屏幕上,TUTOR 的命令按坐标把文字和图形直接放上去,因此没有文档那样的行进方式。公告和交谈的画面也是在这里定型的。

黑色的面上,只用一种发光的橙色显示文字和线条 / 文字不按行走,而是按坐标摆放,也会插进图形中间 / 文字和线描叠在同一个面上,没有边框把区域分开 / 有些题目要用手指直接触碰屏幕来作答

design.md图像提示词

534

Breeze — KDE Plasma 5 的 Breeze,浅色配色(Kubuntu 20.10)2020年 — Wikimedia Commons / CC BY 4.0 · © Kubuntu, Breeze

Breeze

ブリーズ / 2014– / 风格 / 平台界面语言

KDE 随 Plasma 5 一起引入的默认视觉样式。发布说明自称是高对比度的扁平主题,把图像整理得简单而接近单色。它不用装饰,而是依靠文字排版来区分元素,并且从一开始就把明暗两套配成一对。

没有明暗塑造的平面,元素的边界只靠色彩差异和对比来交代 / 图标和图像被整理得接近单色,用色数量压得很紧 / 标题与正文的对比代替了装饰,文字排版成为画面的骨架 / 同一套图像有明版和暗版,成对存在

design.md图像提示词

535

Acme — Plan 9 from Bell Labs 的 acme 界面 — Wikimedia Commons / CC BY-SA 4.0

Acme

アクメ・インターフェース / 1994– / 风格 / 平台界面语言

Rob Pike 在1994年的论文中给出的画面,把窗口系统、shell 和编辑器合为一体。它没有菜单也没有图标,屏幕上任何一段字符串都可以用中键执行、用右键打开。窗口在纵向的列中堆叠,每个窗口只有一行标签行和正文两层。

窗口在纵向的列中堆叠,每个窗口只由一行标签行和正文两层组成 / 滚动条在正文的左端,右端什么都不放 / 用中键划过一段字符串时,只在按住期间给这段字符串加下划线 / 正文是淡黄色,标签行是淡蓝色,没有一个可按的按钮或图标

design.md图像提示词

536

Oberon System Interface — Oberon-0 的画面,标签行与铺满的界面 — Wikimedia Commons / CC BY-SA 4.0 · © PeterEasthope

Oberon System Interface

オベロン・システムの画面 / 1988– / 版面 / 平台界面语言

维尔特和古特克内希特于1986年到89年间在 ETH 做出的系统的画面。窗口互不重叠,先把屏幕切成纵向的条带,再在条带内自上而下铺满。屏幕上任何形如 M.P 的文字都能用中键执行,因此系统没有菜单这种专用部件。

窗口不重叠。屏幕先被切成纵向的条带,再在条带内自上而下铺满 / 右侧有一条窄带,上面放日志,下面放列有命令的文本,左侧的宽带用于作业 / 每个视图器顶端有一行高的细框,里面以文字排着文档名和 System.Close 之类的命令 / 每像素一位的黑白。边框只有细直线,没有阴影、圆角和灰阶

design.md图像提示词

537

Ribbon — Office 2007 样式的功能区与上下文选项卡 — Wikimedia Commons / CC BY-SA 4.0 · © Halil Şimşek P

Ribbon

リボン / 2007– / 版面 / 微软 UI

把命令以选项卡的形式排在窗口顶端的命令带,同时取代菜单栏和工具栏。它随 Office 2007 引入,微软在官方指南中定义了选项卡、组、上下文选项卡和库这套术语。命令一律带文字标签,尺寸随使用频度而变。

窗口最上方常驻一条以选项卡切换的带,高度固定为48像素 / 带内被切成带名称的组,组名排在分区的下沿 / 命令的图形分32×32和16×16两级,只有高频命令用大图并排在前面 / 随所选对象的类型出现带颜色的上下文选项卡,这组选项卡的名称以 Tools 结尾

design.md图像提示词

538

Solarized — 应用 Solarized Light 的 Xcode 4 2011年 — Wikimedia Commons / CC BY 2.0 · © Jason Brennan from Ottawa, Canada

Solarized

ソラライズド / 2011– / 风格 / 界面风格

Ethan Schoonover 连数值一并公开的、供终端和编辑器使用的十六色。它由八个底色和八个强调色组成,底色在 CIELAB 上的明度差取成对称,因此明底和暗底互换后阅读的调子也不变。它压低明暗差,用色相的差别来区分词。

底色既不是纯黑也不是纯白,一个偏青绿,一个偏米黄 / 正文与底色的明度差很小,以比白底黑字更柔的力度让人阅读 / 八个强调色的明度几乎一致,只靠色相的不同来区分 / 在明底和暗底之间切换,同一个强调色仍以同样的角色出现

design.md图像提示词

539

Skeleton Screen — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Skeleton Screen

スケルトン・スクリーン / 2013– / 技法 / 界面风格

加载时不出旋转图标,而是先把内容进入之前的空画面显示出来,再把信息一点点灌进去的做法。Luke Wroblewski 在2013年以自制应用 Polar 的反思为由,用这个名字介绍了它。它展示的不是让人等待这件事,而是事情正在推进。

加载过程中不出现旋转图标和进度条 / 正文和图片要落入的位置上,先放着同样尺寸的素面色块 / 内容到达之前版面就已确定,到达后元素也不移动 / 信息不是一次全出,而是按区域依次填满

design.md图像提示词

540

Stamen Map Styles (Toner, Terrain, Watercolor) — 使用 Stamen Design《Watercolor》瓦片的地图 2022年 — Wikimedia Commons / CC BY-SA 4.0 · © Alexschneider250

Stamen Map Styles (Toner, Terrain, Watercolor)

スタメンの地図様式 / 2010s– / 风格 / 信息设计

Stamen Design 公开的三种有名字的地图样式,Toner 是黑白二值,Terrain 由地形阴影和植被的颜色构成,Watercolor 由在纸纹上晕开的色面构成。它让底图的外观可以像画风一样挑选,而不是靠配色设置去调,这一点与此前的网络地图不同。

Toner 只用黑与白绘制,没有灰色的中间调 / Watercolor 里海陆的交界像笔锋的边缘一样晕开,放大后纸纹仍在 / Watercolor 的水面在蓝里掺着绿松石色和紫色,道路则在橙与红褐之间摆动 / 注记、线条和底色分属不同的图层,可以去掉用不上的图层再分发

design.md图像提示词

541

Single-Serving Site — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Single-Serving Site

シングルサービング・サイト / 2008– / 版面 / 网页上的读物

取一个专用域名,只用一页、只做一件事的网站。2008年2月 Jason Kottke 给了它名字,读者寄来约四百个实例,于是它作为一种类型固定下来。没有导航也没有可逛的去处,问题的答案铺满整个画面,到此为止。

域名本身就是问题,页面的内容只有那一个词的答案 / 没有标题也没有段落,一个词或一张图占据画面中央 / 没有菜单、没有搜索、也没有页脚链接,不给人准备下一步可去的地方 / 标题多为 Is It Christmas? 或 Is Twitter Down? 这类用是或否就能回答的句子

design.md图像提示词

542

ADV / NVL Text Layout — 《暮蝉悲鸣时》韩语版的 NVL 型界面 — Wikimedia Commons / Public domain

ADV / NVL Text Layout

ADV/NVL(ノベルゲームの文字組み) / 1990s– / 版面 / 游戏与纸牌

视觉小说的文字排版有两种带名字的型,ADV 把台词和叙述一行一行放进画面下方的窗口。NVL 则在占满整个画面的窗口里堆叠多行,每到分隔处就换页。制作环境 Ren'Py 的官方文档正是把两者定义为一对。

ADV 在画面下方常驻一个横长的窗口,一次只出现一行文字 / NVL 的文字铺满整个画面,读过的行向上堆叠 / NVL 换页时堆着的行一次全部消失,下一页从空白开始 / 选项的出现方式随型而变,NVL 不用全屏菜单,而是把选项排在当前正读的文字之后

design.md图像提示词

543

GitHub Primer — GitHub Primer ViewComponents — official file-tree snapshots across appearance modes — Copyright (c) 2020 GitHub / MIT

GitHub Primer

GitHub Primer / 2017– / 风格 / 平台界面语言

GitHub 的设计系统把密集的开发流程转化为颜色、字体、图标、间距与组件的共同规则。它让流程先于装饰,在狭小空间里容纳大量状态与操作,同时不牺牲无障碍和响应式表现。

中性色表面、蓝色链接与克制的状态色 / Octicon 图标配以简短的操作标签 / 用细边线分开列表、标签页与侧栏 / 即使信息密集,字号与间距仍遵循一致的级差

design.md图像提示词

544

Adobe Spectrum — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Adobe Spectrum

Adobe Spectrum / 2013– / 风格 / 平台界面语言

Adobe 跨应用的设计系统。它以理性、人性与专注为原则,在桌面端和移动端之间调整密度,同时让工具繁多的界面不从作品本身夺走注意力。

中性色表面,鲜明色彩只留给选中状态 / 图标、字体与边框按同一尺度共同变化 / 工具栏和属性面板用细线相接 / 创作内容始终比界面更有视觉分量

design.md图像提示词

545

Atlassian Design System — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Atlassian Design System

Atlassian Design System / 2012– / 风格 / 平台界面语言

一套把 Jira 与 Confluence 的复杂度转译为共享令牌、内容规则、间距、网格和组件的系统。一致性建立信任,也让大量议题、文档和状态仍可导航。

白色与浅灰色层次配蓝色主要操作 / 圆角卡片与胶囊形状态标签 / 侧栏、表格和详情面板之间界限清楚 / 颜色、间距、圆角与高度均由令牌控制

design.md图像提示词

546

Ant Design — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Ant Design

Ant Design / 2015– / 风格 / 平台界面语言

一套以可复用组件和页面模式让企业 Web 应用保持低熵的设计系统。自然、确定、有意义与生长这四项价值,把表格、表单、层级与状态系统化,却不降低信息密度。

小字号与细线组成的密集表格 / 蓝色主要操作与含义明确的状态色 / 表单、分页、树形结构与表格保持一致 / 靠对齐和重复建立可读性,而不是依赖宽松留白

design.md图像提示词

547

Shopify Polaris — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Shopify Polaris

Shopify Polaris / 2017– / 风格 / 平台界面语言

Shopify 的界面框架把商品、订单、付款与顾客统一为一套商业语言。卡片和区块把决策分开,简短的状态与操作文字帮助商家持续推进店铺事务。

白色卡片叠放在浅色底面上 / 绿色用作成功或向前推进的信号 / 标题、状态与主要操作集中在页面上方 / 以紧凑徽标表示商品、订单与付款状态

design.md图像提示词

548

Black Dandyism — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Black Dandyism

ブラック・ダンディズム / 18th century– / 风格 / 时装史

以剪裁与仪态塑造自我,并对种族化凝视作出回应的一条传统。它不是某一种装饰程度,而是熟悉既有规范、移动其中的细节,同时承载尊严、抵抗与身份。

贴合身体的精确剪裁 / 从帽子、衣领到领带、鞋履保持完整线条 / 以颜色、图案或姿态改写经典男装规范 / 自信而正面的自我呈现

design.md图像提示词

549

Power Dressing — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Power Dressing

パワー・ドレッシング / 1970s–1980s / 风格 / 时装史

让职场权威变得可见的穿衣方式。20世纪80年代,剪裁锋利、肩部宽大的套装成为女性与男性向上流动的标志,放大并硬化轮廓,同时也承载着融入规范的压力。

垫肩夹克把肩部横向撑宽 / 收紧腰部,形成倒三角轮廓 / 深色精纺面料与细条纹 / 套装、衬衫、领带或高跟鞋彼此协调

design.md图像提示词

550

Fashion Deconstruction — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Fashion Deconstruction

ファッションの脱構築 / 1980s– / 风格 / 时装史

把缝份、里衬、毛边、纸样与不对称拼接暴露出来,不再把服装隐藏成一个无缝整体。它不只是破坏,而是拆开惯例,再用这些部件建造另一种身体。

缝份与里衬翻到外侧 / 未经收边的边缘与刻意的磨散 / 不对称拼接与移位的平衡 / 把纸样与衬布当作完成表面

design.md图像提示词

551

Camp Fashion — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Camp Fashion

キャンプ・ファッション / 19th century– / 风格 / 时装史

一种热爱人工感、夸张、戏剧性、戏仿与过度,并享受好品味和坏品味边界的感性。它的力量不只来自喧闹,而在于把严肃放大到转化为幽默与批评。

超出人体尺度的夸张轮廓 / 人工材料与过量装饰 / 引用历史服装与流行文化 / 幽默、戏仿与戏剧化姿态

design.md图像提示词

552

Mori Girl / Mori Kei — AI 生成的诠释图像
AI 诠释图像(并非参考作品)

Mori Girl / Mori Kei

森ガール/森系 / 2007– / 风格 / Japanese Street Fashion

一种由都市穿着者想象“可能住在森林里的女孩”而形成的日本街头时尚。宽松叠穿、米白与大地色、自然肌理和旧式配饰,共同延伸为关于慢生活的叙事。

宽松连衣裙与半身裙的多层叠穿 / 低饱和米白、棕色与苔藓绿 / 蕾丝、针织、亚麻和羊毛肌理 / 皮鞋、篮子和旧式配饰

design.md图像提示词

编辑方针

IndexStyle并不收进所有设计相关术语。独立条目必须描述一种可辨认、可复现,并能与近邻区分的视觉语言。 收录标准

回到页首