为Square联合创始人Jim McKelvey转变网页设计

为Square联合创始人Jim McKelvey转变网页设计

“世界不需要有关Jim McKelvey的另一个Wikipedia页面。”

这就是吉姆·麦凯维本人在我们第一次会议上告诉我们的团队的时候,我们讨论了他的新网站的目标。

这位艺术家,慈善家和科技大亨(吉姆(Jim)于2009年共同创立了Square)即将出版一本书,名为 创新栈。他需要一个分享他的想法和观点的地方。一个可能成为思想交流的渠道,可以分享有趣的文章或写他想解决的问题,所有这些都是希望激发他人进行创新。 吉姆·麦克凯维的网站,但不是Jim McKelvey的网站。

所以我们开始工作。

带有引言的图形"Jim McKelvey的网站,但不是Jim McKelvey的网站"

早期的概念。

我们的第一次迭代 网站设计 几乎是一个简单的作者网站,根本不是他要找的东西。

我们将设计保持简单以反映Jim的极简风格,但对Jim的关注度过高,因此对他和他的书进行了宣传。

吉姆是一个很酷的人,并且通过在他周围建立所有网站,这种冷静被掩盖了。他的成就令人赞叹不绝,而且他对网站的想法不屑一顾,因为这可能会使他看起来很自夸或自负。 (此外,如果您问我们,这些成就反正说明了一切。)

吉姆·麦克凯维网站设计的第一个迭代

吉姆·麦克凯维的第一个迭代’s Website 设计

创新与技术领导者需要一个更具创新性和技术领先性的网站。

我们回到了 绘图板 Adobe XD。

 

有东西搞砸了。

大多数设计师都熟悉 网格系统,这使他们能够以有组织,平衡和连贯的方式安排元素。大多数现代网站都基于该框架(包括该框架),但通常未经训练的人看不到它们。

为了使事情变得有趣,我们使网格可见。

我们在背景上添加了细的垂直线以暗示网格结构。通过使用网格以及负片空间,我们可以以视觉上有趣的方式悬挂内容。

吉姆·麦克凯维 Website 设计

它仍然需要其他东西。正如Atomicdust的合作伙伴/创意总监Mike Spakowski所说, 好的设计是一个很酷的图像,清晰的字体以及将所有东西弄乱的东西。

就是在那时,我们添加了水平滚动条,以打破约定并使用户感到惊讶。使用我们前面提到的工具Adobe XD,我们设置了站点原型,可以在其中测试该功能并查看其工作方式。

我们被迷住了-水平滚动添加了一些意想不到的元素,而又不影响站点的可用性。 水平滚动是将所有内容弄乱的要素。

现在我们只需要确定其余的内容即可。

 

设置音调。

我们使用该网站的语言就像是Jim自己编写的那样,如果您问我们的高级撰稿人Rich,这是非常令人生畏的。

除了是一位非常成功的商人和现已出版的作家,吉姆还具有敏锐的幽默感和独特的见解。正如他告诉我们的,有一个原因,他个人在Facebook或Twitter上的活动并不活跃:免责声明不能容纳280个字符-需要两名律师来捍卫他的幽默感。

因此,我们写的副本就像吉姆一样,既鼓舞人心又坦率。有时它是自嘲和嘲弄的。语言推动访问者和自身界限。

带有Jim McKelvey网站的Books页面的iPad

Mobile Website 设计 for 吉姆·麦克凯维

网站的一个重要方面是博客,或者我们称之为兴趣。 Jim在这里可以分享他的想法和经验,并与访客建立联系。吉姆不仅仅是交流,还希望激发人们的灵感,展示想法和创新的力量,以改变世界并解决我们最棘手的问题。

我们通过使“见解”页面上的标头照片缩略图垂直,从而打破了惯例, 该页面的标题使访问者感到 就像他们正在和吉姆喝咖啡:“这是我最近一直在想的事情。”

我们确实提供了有关Jim成就的信息,但是通过将它们放在“关于”页面的“首屏之下”并描述了项目本身(而不是Jim的参与)来确保重点是想法,而不是Jim。

博客 设计 for 吉姆·麦克凯维

停止,合作和倾听。

吉姆喜欢这个网站的新版本。周围都有击掌。

具有讽刺意味的是,这一过程类似于吉姆在将新想法变为现实时的经历,正如他在他的《创新堆栈》一书中所描述的那样,当您执行以前从未做过的事情时,首先失败是该过程的一部分。 没有最初的设计和吉姆的反馈,我们永远都不可能得出最终的结果。

但是最好的项目是协作的,客户和代理机构都可以互相推动,共同形成最终结果。

而且它与Wikipedia页面几乎完全不同,所以我想说这是成功的。

探索该站点。

新的号召性用语

布莱斯·哈特·施密特

布莱斯·哈特·施密特

布莱斯(Blaise)的数字营销之路始于新闻业,并通过公共关系绕道而行。

她热衷于各种媒体的讲故事,她在写作,设计,策略和数字营销方面的经验可以帮助客户制定强有力的营销计划。

布莱斯·哈特·施密特(Blaise Hart-Schmidt)的更多帖子