7个网页设计的必要环节

不一样的公司和不一样的团队，对于重规划有着不一样的需求和考量，天然也就有着不一样的流程。咱们并未遵循某种特定流程，可是在迭代过程中，咱们做好了下面7件环节，终究得到了咱们想要的成果。

​

　　1、访谈

　　我对咱们的决策团队的每一个成员进行了一对一的面谈，借此明确他们心中的Shopify Plus 到底是啥。为了接近真实，每次访谈我都会作笔记而且录音，随后繁复回放，细心研究。

　　访谈之后，一般能从中获取创意——从那里能了解对于商品的各种细节。这样一来，无论是商品将来的愿景、方针、品牌攻略、项目准则仍是网站案牍，都对比简单承认。作为一个网站而言，非常好的传达信息，才干真实让用户感到惊喜。

　　2、项目简介

　　在真实开端深化开发之前，咱们需求写一份项目简介，确保每个参与者的信息和进展保持一致。咱们会依据项意图实际情况，随时对简介内容进行调整和修正，实时更新。

　　一般，项目简介会答复以下疑问：

　　•咱们正在企图到达啥意图?

　　•咱们怎么承认这个项目是成功的?

　　•咱们需求做啥工作?

　　•咱们为啥需求这样做?

　　•哪些工作对错做不行的?

　　•咱们为谁在做这些工作?

　　•他们怎么了解这些工作?

　　•项目团队中包括哪些人?

　　•咱们的最后期限是啥时分?

　　3、竞品剖析

　　咱们还需求细心审视咱们的对手。为此咱们列出了竞争对手的列表，并开端了解在电子商务范畴以外咱们的商品怎么服务于方针客户的。

　　咱们会对比咱们和对手之间的优势、下风，咱们碰到的机缘，特有的特征，以及需求躲避的疑问。

competative

　　4、信息架构

　　合理牢靠的信息架构能够有效地将内容组织起来，让信息更简单被用户获取并了解。在进行网页规划的时分，用构造化的示意图来出现全部网站各屏之间的联系，能够使你从更高的层面上来掌握全部网站。

　　所以，我先用构造示意图画出老版别网站的各屏联系。在更新升级之前，我充沛屏幕了其间的内容、方针和流量散布，并提出了建议。构造示意图协助咱们界定项目施行的范畴，就像一份详尽的核对清单，让咱们在组织内容、规划界面、编写代码的时分更为明晰明晰。

information-architecture

　　5、线框图

　　在重规划过程中，我会运用线框图来勾勒全体，帮我思考疑问，打通思路。有人喜爱在将主意涂鸦在餐巾纸之上，有人喜爱面对面共享主意，还有人喜爱将主意执行于草稿在线共享。

　　线框图的优点在于，你能够疾速、快捷地填充不一样的内容。仅执行于文档的思路不行具象，大略的草稿不行规整，线框图能较好躲避这些疑问，不一样类型的内容规整地摆放在一起，你能够明晰掌控规划，模块与模块之间的联系。

wireframes-1

　　高精度的Shopify Plus 重规划线框图

　　6、启示板

　　咱们会在启示版(Inspiration board)上展示新品牌的视觉规划，展示它可能的姿态，这也是我从团队获取支撑的一种方式。

　　同时咱们还会运用Pinterest，为了防止咱们在单个画板中泥足深陷，咱们发明了多个画板，为导航、动效、排版等不一样范畴，有对于性地收集事例，获取创意。

　　当我有主意的时分，会在AI中进行勾勒，它们一般都是文字、图像和颜色的结合体，看起来形同广告。随后，相同相近的规划元素会出如今咱们的草稿中，不过其间各元素的方位和外观，会有所不一样，而且有许多不一样的版别。

mood-board

　　Shopify Plus 的启示板

other-mood-boards

　　在启示板上对Shopify Plus品牌进行探索

　　7、视觉稿和原型

　　很多人并不在意印在纸上的线框图和视觉稿。确实，直接在屏幕上看看还挺不错，可是直接检查执行于纸面上的线框图、视觉稿和原型作用非常好。

　　别的，我在线框图制造期间就开端制造可交互的视觉稿(原型?)，而且拿这些东西同客户进行沟通交流，一直到它们终究被执行为代码和实际的从程序。