文章来自:https://iohk.io/blog/a-major-brand-refresh-for-cardano
(发布时提示:新手发贴只能放一张图。所以,只好把上传的图片给拿掉,文章中用‘图’来代替。可以打开顶部的链接查看图片。)
IOHK创意人员如何用形式服从功能来重新设计Cardano
一月份,Charles Hoskinson发消息说他偶然发现一个在线视频,让我们了解一下。我打开他发来的链接,发现这个视频真的很吸引人。一个加密货币爱好者研究Cardano,并制作了一段Cardano发展历史的动画。用数据可视化的方式将出现在屏幕上的Cardano代码着色高亮显示,这些代码编写的时间长达2年多。从一小段开始,渐渐地,挤满了屏幕,最后以许多部件相连呈现出一个复杂的结构。
这让IOHK团队灵感一闪。我们收到很多挑衅的帖子,在网络上指责Cardano是“雾件”,指的是我们没有实实在在的产品。这段视频不仅具有观赏性,而且它还发挥出了作用,因为它完全击碎了那些说法。Cardano开发人员把每一部分代码提交到了Github,你可以随意地使用这些信息。你不仅能够看出他们是多么的活跃,而且很长一段时间以来Cardano是开发最密集的加密货币项目。我们想看看怎么能够利用好这个创意。
设计团队最近启动一个项目来重塑整个Cardano及相关网站的品牌标识。我们对每个网站的布局和它展示的信息进行了彻底修改。我们想让网站更易于使用,以信息量丰富的方式来更有效地展示数据。这将给用户呈现重要的内容,但是也会以一种以往其它加密货币项目没有做过的方式来让他们深入理解细节信息。
因为这个动画太有吸引力,而且也具有实用意义,所以我们决定把它融入我们的设计中,并由IOHK富有创造力的程序员Scott Darby操刀。与此同时,可视化设计师Juli Sudi会负责剩余的工作,并为品牌设计一个可辨识的外观和印象。
(图)
基础工作
Juli说:“对我来说,最开始要做的是找到样式设计的大方向,设计出核心的视觉元素,它们能够在网页之间共享,并为以后的设计奠定基础。”
她选择图示法,并用调色板和布局样式进行尝试。对每一种可能的方向,她以不同的方式使用基本主题进行样式测试,比如改变图标样式,版式,间距,颜色集和梯度变化。测试版本与开发团队共享,以便收集反馈和选择下一步要使用的元素。
多次的试验和想法的调整后,我们采用了这个原则:设计应该突出功能性。颜色应该表示某样东西,而不是因为它们好看才被选中。形式应该服从功能。我们认为样式设计的方向仍旧还是个粗糙的概念,但是都认同它是新设计的起点。
社区参与
随后,Juli开始与社区成员Felix Koutchinski讨论,他是来自德国斯图加特的一位平面设计师。他引起我们的注意是因为他写了一篇关于Cardano路线图设计的博客。他的反馈值得重视,我们随后与他密切合作。社区应该参与到我们做的每一件事中,因为最终我们做的一切都是为了他们。
和Felxi的讨论显露出了我们在路线图设计上许多忽略的方面。缺乏过滤机制,就很难找到你寻找的信息。对浏览网站的人来说,按照进度或者最近的更新情况对开发任务排序非常重要。开发过程的阶段性目标不要依照时间顺序排列,而是齐头并进,这要求不一样的导航样式,来节省用户在页面中的浏览时间。我们应该更清晰地展示已经完成的开发任务。应该有个简要说明解释项目的每个组成部分。用户应该能够按类别筛选内容,比如开发阶段(Shelley, Goguen等等),或者按照开发任务是否完成,或者依照谁在负责这项工作(IOHK, Cardano基金会,Emurgo)。
下面的图中你可以看到三种布局设计。第一个是原来的样式,第二个是Felix的设计,第三个是我们采用的新的布局样式。
(图)
在产生这些想法的同时,Juli也在进行调色板和样式指南的设计。
(图)
Gource
与此同时,Scott一直在忙于Gource的概念验证,这是我们以Charles发现的原来那个动画的设计者来命名的。Scott研究了Gource资源库的主要内容。原来的视频是离线的,但是,我们决定Gource要实时显示我们的开发进度。Scott说:“Gource是一个动态的,有生命力的艺术作品,产生于Git资源库目录结构。可视化效果根据开发者提交代码而不断地实时变化。每次提交后,被编辑的文件就被点亮显示。”
(图)
最近被修改的文件以红色显示,没有被编辑的则以蓝色显示。我们选择以3D可视化来展示,与原来的2D动画相比,效果截然不同。我们也从社区成员设计的cardanoupdates.com网站上发现了不少的好创意。
(图)
Gource将在每个Cardano网站上运用。为了获得最佳体验,建议在桌面端使用最新版本的Chrome, Firefox, Opera还有Safari来观看Gource的效果。每个开发项目都有一个不同的Github文件结构,Gource将代表它,并作为其唯一的识别方式。通过点击Cardano路线图的头部发亮的按钮,可以全屏幕观看丰富的互动功能展示。将来我们会放入更多的特征。这些将为观看者提供一种探索代码的手段,并以一种兼具功能和美感的方式对开发过程有更多的了解。
(图)
整合
这时,高级全栈工程师Tomas Vrana开始与Juli一起把这些构思变成现实。Tom帮助改进了这些设计,这样他们在实际运行中会表现的很好。如果用户按照开发任务的负责方筛选内容,那么有一列用来显示开发人员提交代码的情况就不太合理,因为Emurgo和Cardano基金会并不编写代码。Gource仍旧还处于起步阶段,进行概念验证的过程。随后,我们将不断地把它适配到所有设备上,为用户提供更多功能和易用的组件。
Cardano路线图不是我们第一次部署新的设计样式;它们也被运用在最近启动的Symphony of Blockchains和Cardano测试网上。
(图)
Alexander Rukin采用了Juli的设计,很快搭建了新的Cardano测试网的网站。这些新设计绝妙的一点就是,你可以使用它们,并按照不同的需求对其改变。测试网网站的内容不同于路线图,在适配这些设计时Alexander做的特别棒。Alexander也负责Daedalus的设计。
(图)
George Clark和Jonny Smillie,都是全栈Web开发工程师和设计师,一起助力测试网网站的启动。Cardano首次为测试提供智能合约功能,George和Jonny花了很长时间来确保测试网成功启动。额外的挑战是,新设计的截止时间非常紧,项目经理Robert Moore加入进来,带领我们完成开发任务。
(图)
(图)
今天,我们发布了重新设计的Cardano路线图,你能够看到以上描述的种种工作的实际效果。你可以观看新的设计特点,从查看开发人员提交代码的列表,到接收每月发布路线图的提醒。
我们愿意倾听你们的反馈,让我们知道你们的想法。我们也许最终会和你一起工作,就如同我们现在和社区成员在做的那样。
现在,Cardano第一次有了真正的品牌标识,并用它以可视化的方式精确地展示Cardano这个项目。我们将在其它的网站上应用这个重新设计的样式,包括Why Cardano和Cardano docs。关注IOHK的Twitter和YouTube账号获得最新消息。这一重新设计将完全提升你对IOHK项目的理解,并且改变我们公司传递信息的方式。
在IOHK,我们相信,Cardano不仅仅是个开发项目:它是分布式系统,是社会科学,是政治活动,以及其它的种种,它也是一个设计挑战。
(图)
(图)