人人都能懂的设计方法论:界面 X 字体 X 创造力

人人都能懂的设计方法论:界面 X 字体 X 创造力

极客公园在上周 Audi City 举行 Geek+ 线下活动,来自 eico design、方正字库与 bong 的嘉宾们,带来了一场关于界面、字体与创造力的技术连弹,与在场的 60 多名极客探讨了「科技与设计的共生关系」。

硬设计时代10.jpg济济一堂的极客们

最终,界面没有界面

by eico design 项目经理及交互设计师 喻秦主题演讲《界面之后的「界面」》

按常规理解,界面是我们与机器沟通的一种语言,而机器本质上是一个更高级的工具。在过去,刀剑、扇子等工具并不能听从人类指挥,而电脑的发明则使人类第一次可以给创造的工具下达指令——计算公式、破解密码等等。

在很长一段时间内,人类为与机器沟通,被迫学习机器的语言,直到 1984 年 macintosh 普及了图形化界面,沟通语言第一次以人为中心。而这种使用桌面、图标等隐喻的沟通方式与今天最新的系统相比,本质上并没有改变。

硬设计时代4.jpg人机界面发展史:1984 年与 macintosh 

真正引爆图形化界面革新的,是 2007 年 iPhone 带来的触屏界面之普及,界面的输入与输出合二为一,大幅降低了人机界面的学习成本和使用难度。这预示着我们进入全新的界面时代——没有界面的界面,并以手势、语音这些自然的交互方式和界面形式为表征。

因此从长远来看,人机界面会逐渐贴近人类沟通方式,其学习成本将逐渐走低。同时,人机界面的载体与人的物理距离也在趋近于零:初期的巨型机需要我们奔赴工厂或公司才可使用,而现在,手机能被放置在口袋中随身带走。

目前,在我们与生活服务连接的平台中,智能手机是最强的。但有趣的是,一些新兴品类会直接套用既有品类的界面语言(例如,特斯拉的车机直接拷贝了 iPad 界面),因此从这个意义上来说,智能手机的界面语言会直接影响下一个新兴的界面语言。

虽然,直接套用的界面语言让人能更好地熟悉,却未必适合新的使用场景与硬件特性:特斯拉那款 17 寸的大屏在阳光下令人「无法直视」。因此,真正适合的界面往往从混乱中成熟,就如当年从 Windows Mobile 主宰中脱颖而出的 iOS。

硬设计时代5.jpg同语音、手势、面部识别、眼动、触觉连接的自然用户界面

由此,自然用户界面将真正开始普及。例如智能手表界面会抛去解锁、按键等繁琐动作,不再是手机界面的缩小版,而是可以使用当前与硬件本身特征相关的界面——一个可能由手势与动作诠释、基于体感和触感的界面。

与之对应的趋势是,界面的要素将逐步后退,信息本身将成为界面,出现在各个平台,故界面语言的跨平台性将变得至关重要,毕竟设计与维护所有平台界面的成本极高。从这个意义上谈,Windows Mobile 和 iOS 7 所标志的图形化界面之跨平台使用,具有里程碑式的意义。

因此,既有平台与孕育出的新平台在经历一段相互影响的不稳定后,他们将逐渐区隔于彼此,被每一个品类独立采用,多元化地组合交互方式和界面形式。

未来也许是脱离传统触摸的、更为直觉的。在这种可能下,构成信息本身的那些字体排版、图片组合将变得更为重要,可能也预示着视觉设计的重新回归。 

字体之美:从人文到技术的循环演进

by 方正电子 字库开发总监 仇寅主题演讲《从媒介变化看字体变迁史》

设计的本质是满足人类,所以在功能性表达上也需要更多柔软与温情。当我们回顾字体发展史「寻找温度」,一条是书写,一条则是印刷字

甲骨文到篆书再到楷书的演变,也是手写汉字由复杂到简单,到清晰再到美观的过程。由线条组成的甲骨文与篆书,个性度低、容易混淆,而有了比划、撇捺点折的楷书,则令汉字更为容易识别。1500 年前的楷书时代,汉字字体的发展便终结了。

硬设计时代3.jpg

手写汉字发展史:易识、易写、美观(充满个性、灵性、亲切的人文感)

印刷字的发展则与媒介有极大关联。最早的文字刻于甲骨,后铸于青铜、刻于石碑、书写于书简和布帛,最后发明了纸张。宋朝的雕版印刷由人工在木板上一字一字刻成,其样式开启了宋体字的初级阶段。经过元代的雏形时期,现代宋体字在明中期定型。换言之,我们开始实现了印刷字的标准化,这从楷书产生到宋体字形成,其间走过了一千年。

清朝基本沿用了明代体例。而民国时期的印刷字体再造辉煌,从仿宋到多样化楷体,皆充满人文色彩与脉脉温情。21 世纪的今天,黑宋仿楷的出现并未带来实质性改变,只是在精致度、适度性及排版优良性方面获得长足进步:程式化、整齐度和统一性,让我们便于阅读。

然而,这种几何、严整与冷静的代表,显得刻板与工业,不如手写文字有灵性、令人亲切。因此在清朝两种字体并行,以宋体字为主的叫硬体字,刻起来方便省钱,而有钱人则使用手写体为主的软体字。

到了新的媒体时代,纸质媒介与屏幕媒介共生,屏幕阅读越来越成为主流,这种变化为字体设计带来全新挑战,其中最为重要的是不连续变量和自发光产生光晕。

(1)不连续变量

纸张中的图形皆为连续变量,一条光滑的曲线是没有台阶的。相较而言,由像素构成的屏幕充满台阶。这种不连续变量造成每个汉字的横划排列会产生台阶式越变:同一款粗细的字体在不同字号下,显示的字不一样。

硬设计时代6.jpg

量:从 5 磅到 7 磅

(2)自发光产生光晕

纸上的反光由光照在纸上反射而得,因此看到的文字与图像并无光晕。屏幕中的笔画则是自发光,便带有光晕显得模糊。如将电脑亮度调高,光晕加深笔画即变粗,这是在黑底白字的呈现。如果白底黑字,显示则与之前相反,因而屏幕也有其特殊性。

硬设计时代7.jpg

置与矗:从 0 到 100

此外,屏幕的不断发展也为字体设计创造了优良条件,精度由原先的 96ppi 发展到现在的 300ppi 以上,变得更为精细、富于人文色彩。给了我们如下启示:首先,笔画得到了更为精致的安排,横划之间的距离在软件的帮助下变得非常容易测算;同时,结构塑造要求形散而神聚,不能丧失汉字的灵性与神魂;更多的字体家族被设计出来,在台阶式越变的情况下,让用户能自由挑选不同粗细的同一字体;适合屏幕显示的字体之稀缺,也亟需开辟新品类。

硬设计时代8.jpg

赢:从低精度到高精度

以方正第二代屏显字体为例,设计上应特别注重识别性与美观性。

(1)识别性

中宫对汉字的影响极为深刻。做字之时,需要让中宫既能维持汉字的轮廓特征,又能保证中间笔画的清晰度。方正第二代屏显字体因为收紧了中宫,让每个字轮廓更为明显,阅读体验也更为舒适。

硬设计时代7.jpg

(2)美观性

美观的标准之一是耐看。频繁接触几何化与工业感设计,人们难免产生抵触、希望重归人文。因此字体被造出后,通常有相应的产品周期。在悠黑的设计中,技术与艺术的平衡成为主要追求。标准之二则是适读,阅读用的正文字体,应能「看不出风格」地进行自然诉说,而非因个性干扰信息。

当我们考虑正文字体的选择,要回归用字的核心目的,究竟是展示还是阅读?根据内容和受众,考虑风格、字面、字重,通过默诵与对比,回到阅读体验中去检验才能真正关怀用户。 

流畅的产品设计背后,是创造力:以 bong 为例

by bong 智能手表创始人 & CEO 顾大宇主题演讲《缩短人与信息之间的距离》

创造力对创业者而言,是必须要解决的问题。在 bong 的理解里,把握本质和打破常规构成了创造力

(1)把握本质

回溯历史,人类社会其实非常简单,安全感、社会价值实现、影响力传播、传承后人等需求,千百年来并未改变。现在的产品经理,需要找到这种根本需求并以产品的方式还原,这或许与当年鲁班的做法如出一辙。

在 bong X2 中,自然操作是我们把握的本质。为了让用户查看智能手表信息,无需双手费力地触碰、操作,我们设计了单手控制。同时,追踪睡眠也必须是全自动的,因此 Bong 在两年前制成的睡眠追踪识别算法,既是世界第一个,也成为了业界标准。

(2)打破常规

互联网的试错,即突破既有,实现真正的创造。Cardflow 是 bong 非常重要的信息呈现方式,打破了 App 的信息架构,是单轴的、由许多 Card 的简单信息串接而成。

它也来源于我们另一个重要观点:缩短人与信息间的距离,即接受信息时需要转化的成本、门槛、场景应越少越好。这是基于人脑的单线程思维模式,时时跳跃、无法同时思考很多,让用户往往不愿意去理解多线程。因此,bong 不装 App,因为 App 只是信息接入的载体。而 Cardflow 能帮助 bong 将单轴信息,尽可能贴近人。

硬设计时代9.jpg

最后的 Workshop 上,全场 6 组极客就「如果人们失去视觉,产品界面将发生哪些变化」及「2050 年,在文字的载体、设计和阅读上,将发生怎样的变化」展开了思维竞技,以下综合最优胜的团队答案,以飨读者。

如果人们失去视觉,产品界面将发生哪些变化

人类失去视觉后,还剩听觉、嗅觉和动作,因此屏幕将不复存在,界面可能会成为基于那三种感官能控制的任何设备,发出的声音、产生的热量、感受到的震动、闻到的气味,都将是这类设备所产出、为人所接受的。

在这种状态下,交互被拆分成了两部分,一部分是人对系统或产品的指令,即输出;另一部分则是系统对人的反馈,即输出。在动作控制中,可以被触摸的手环,便是可接触性的,不能摸到的踢与跑,是不可接触性的。

此外,交互也有主观与非主观之分。值得一提的是非主观情况,例如通常情况下,人不希望系统记录夜晚睡眠的心率,但当身体不适等特殊时刻,系统也能实现记录。

硬设计时代11.jpg分工合作的小组成员

2050 年,在文字的载体、设计和阅读上,将发生怎样的变化

联想到越来越多的近视眼同学,在阅读时非常受累。2050 年时,文字可能会依托某一种载体,能主动判断承载人的视力水平,面向文字时便自动看清,让人恢复 5.2 的视力。

同时,产品说明书与产品将紧密结合,不再以单薄的纸呈现,也许能与语音等结合。例如,做危险动作会收到声音提醒。通过这种方式,用户看说明书的同时能进行情感化的交流。

字体的力量交互设计
下载极客公园客户端
iOS下载
反馈