重新想象网页设计过程

WebFX总裁。Bill在互联网营销行业有超过25年的经验,专门从事SEO, UX,信息架构,营销自动化等。William在希彭斯堡和麻省理工学院的科学计算和教育背景为MarketingCloudFX和WebFX的其他关键研发项目提供了基础。

响应式网页设计动画这是一篇客座文章InVision团队。拥有具体可交付成果清单的设计项目的时代已经一去不复返了。随着网页设计和开发的不断发展,静态网页已经不再适用了。

现在,我们需要做更多的事情。我们的任务是设计和开发原型为未来的成长和发展设计系统和规定。Stephen干草最好:

我们不是在设计页面,而是在设计由组件组成的系统。

我们的设计需要在快速变化的设备格局和内容类型中保持领先,这些变化没有放缓的迹象。旧的设计流程正在彻底检修。敏捷性协作适应性现在是设计过程的首要问题。

设计和开发之间的界限越来越模糊。

手机第一

Mobile First插图多年来,移动优先一直是有远见的网页设计师的战斗口号。这是一个设计过程,我们应该从小屏幕的简单布局开始,然后随着屏幕空间的增加而增加基础的复杂性。随着移动设备的销量超过个人电脑,我们知道移动设备的使用已经正式超过了桌面“移动优先”正在成为常态。

除非你喝了很烈的酒数据和数字反对它的人认为移动优先是最有意义的。随着屏幕空间的增加,增加设计的复杂性变得更容易,而不是为了更小的屏幕而降低设计的复杂性。作为一个把时间分配在设计和开发之间的人,我发现自己填补了客户的许多空白。

半页?我来吧。手机设计还没有完成?

我来填补空缺。我不记得上一次需要填充桌面断点的空白是什么时候了。不知何故,桌面布局似乎总是先被模拟出来;移动布局通常看起来像是前者的粗糙堆叠版本。

让我们停止使用“移动优先”作为一个流行语。让我们开始小屏幕的设计过程。

一砖一瓦

一砖一瓦设计是一个累积的过程,每一轮新的进展都建立在前一轮的胜利之上。首先为小屏幕进行规划是有设计意义的。我喜欢在建造东西的时候添砖加瓦,而不是把它们拆掉。

关于这种类型的设计过程,我发现的一个最好的类比是原子设计这是一种通过日益复杂的组合来看待事物的方法论。它是这样的:

  1. 决定一些排版组合、大小和颜色
  2. 将这些选择组合成表单字段和标签之类的小内容
  3. 将字段组装成更大的窗体(如联系窗体)
  4. 将联系表单放入“联系我们”页面,该页面由许多其他小块组成
  5. 重复

不起眼的砖头。小、简单、钝的物体小心组装你的积木,你就有无限的可能性。

不起眼的砖比起从零开始建造,用砖块建造不仅更快更简单,而且从移动设备到平板电脑再到台式机,这一过程都是完美的。想想你(和你的用户)在每一步中真正需要什么,只有在有意义的时候才添加更多的砖块。

超越断点思考

内容的响应能力在讨论响应式网页设计过程时,我们花了很多精力出汗我们的媒体查询断点针对当前设备进行设计,而导致不稳定的主要原因之一是网站的内容。如果可能的话,使用真实的内容进行设计。与你的内容/营销团队密切合作有助于防止游戏后期出现意外。

即便如此,从设计开始到发行(甚至可能是发行之后),内容都会发生变化。短标题越来越多。交换照片。

整个部门被砍掉。一个精心构造的设计系统可以迎难而上。将营销团队零散的Word文档翻译成网站上一个崭新的页面应该不会伤到你的头。

虽然有些领域显然需要(也值得)额外的关注,但我的经验法则是:不要想太多。很多时候,一个聪明而紧凑的设计风格指南是保持品牌形象所需要的一切。

获得真正的

设计原型很棒,但它通常是由构建产品的同一个人在台式电脑上进行的。通过在真实设备上与真实的人分享设计来获得最佳反馈。在移动设备上测试线框即使是线框也可以在实际设备上进行更好的测试测试响应式设计应该是一个广泛而多样的过程。

把它加载到真正的智能手机上。让非设计专业的同事和朋友来梳理一下。看看iPad上的设计(因为平板电脑的销量很快就会超过个人电脑)。

一个全新的世界

我们大多数人都不习惯从小角度看大问题。协作的增加和团队界限的模糊使得设计过程比以往任何时候都要快。为了跟上步伐,我们的设计需要像我们的内容和业务需求一样快速地适应和改变。

从小处开始,以剃刀式的专注力让事情在复杂性增长时保持敏锐。

相关内容

克拉克Wimberly是一个内容设计师在InVision这是一款流行的设计原型工具的开发商。他每天都在写作和创作设计内容(截屏、UI套件和电子书)。此前,他是一名用户体验设计师,并创建了在线社区Android和我

看看ClarkLab他的个人网站。与他联系推特而且GitHub

WebFX职业

加入我们的使命,为全球各地的企业提供行业领先的数字营销服务-同时建立您的个人知识和个人成长。

我们招聘! 视图30 +职位空缺!