Svet:给一家品牌工作室做的网站

六个里的第四个。这一系列中唯一一个「网站本身就是作品」的例子:找一家工作室,看的是它自己那一页长什么样。

Svet 是一家做品牌和上市的工作室。对这个客户来说,网站不是橱窗,是样品:访客不会读这家工作室会做什么,他们看的是它做不做得到。

结构因此而来。`MediaHero` 用一张通栏画面开场。`SpecimenShowcase` 和 `TypeSpecimenMap` 是两个关于字体的板块:前者把字体当样张展示,后者把各个字重铺在一个平面上。对一家工作室来说,这不是装饰,这是手艺的证据。

`TypoScroll` 给出一份用展示字号排的清单,光标经过时某一行亮起来,旁边浮出一张画面。`ParallaxSlideshow` 把作品排成一条。这两个存在的理由只有一个 —— 让页面动起来的方式,和这家工作室作品动起来的方式一致。

Svet:首页从上到下滚一遍

一种没法拿来排字的黄

这里的品牌色是一种荧光黄,而它是个陷阱:作为浅底上的文字,它根本读不出来。在模板里,标题的颜色和品牌色是两个变量,所以这抹黄进了深色上的标题高亮,而文字本身是灰底上的近黑。

七个颜色令牌而不是一个「强调色」,为的就是这个。一个颜色包办所有角色,是拿到一个读不清的按钮和一个只存在于设计稿里的标题最快的办法。

这个网站演示了什么

展示字体是窄的全大写无衬线,正文字体圆而安静。`LifeStories`、`PromoCards` 和 `PullQuotes` 收尾:故事、优惠、引语。一个带数字的板块都没有:这家工作室手上没有数字,也没有什么可以编的。

What we have made
What we believe and what we argue about
What our clients say
The plane we argue about typefaces on
Section 9
02继续读

博客里的更多内容

两篇,不会更多。 更长的一条会把文章结尾变成第二个目录页,而读者已经选过一次了。