给设计师点赞!14个特别走心的网站着陆页设计 - 优设-UISDC

给设计师点赞!14个特别走心的网站着陆页设计

2015/03/06 13463评论区

14-outstanding-landing-page-design-1

编者按:着陆页作为网站门面,重要性不多赘述。不过得花点时间介绍下今天这组网站,既有效地展示了产品,也兼顾了设计美感,两者平衡得非常得当,文中有@网秦UEC  同学细致专业的设计分析,作为一组顶尖案例来学习,绝对不容错过 >>>

在过去的几年里,精美的登陆页面见证了设计趋势实实在在的转变。不论是iPhone应用、Web应用、服务还是实际产品,在登陆页面设计方面的门槛是节节升高。

我认为在其中很多初创公司发挥了很大作用。在初创公司的世界里,给用户留下第一印象的机会仅此一次,所以如何展示产品至关重要。而为了有效竞争,一些比较大的品牌在这一方面也不得不多走点心,而这一竞争就造就了越来越多精美的营销页面,这些页面能够有效地展示产品、说明产品功能和好处,并鼓动顾客的情怀,让他们产生比较高的期望。

下面我收集了一些我个人比较喜欢的营销页面设计,这些设计我觉得融入了大量的心思和功夫,希望能够给大家带来一些灵感。

1)FOREST

Forest是一款能够帮助用户以30分钟为单位集中时间和注意力的工作效率提升应用。其登陆页看起来比较松散,近似极简主义,但仍然很好地解释了产品简单而上档次的理念。

2)MOTO 360

这是摩托罗拉首次杀入智能手表市场,其Moto 360是公司的旗舰产品,因此一定要以一种创新、有趣地方式展示出来。滚动登陆页你会看到以动态UI展示的手表装配过程。其中比较讨巧的一个元素,就是手表图片上显示的是当前实际的精确时间。

3)Instapaper

Instapaper是比较成功的一款阅读储备应用,其特点是应用界面简单、简约。其登陆页面也集产品之大成,虽然有大量的留白空间,但却展现出了一切必要信息,没有乱七八糟的东西。

4)Ring

Ring是一款门铃产品,不在互联网圈子内。其内置的摄像头可以让你通过手机看到门前来者,甚至还能检测到自己房屋周边的动作情况并向你发送警报。这是个比较新奇的理念,所以可能需要详加解释一番,其登陆页面充分而优雅地展示出了产品的所有好处。

5)Gumroad

Gumroad可提供网上销售服务,用户还可通过其系统收款。其登陆页面踩中了很多设计最佳实践方式:有明确的方向指引(大大的“免费设立”按钮)、用词巧妙的操作引导、与之合作的大网站的logo,还有用精美插画绘制的整体流程方式。

6)RDIO

Rdio提供在线音乐服务,其拥有一套制作精良的登陆页。页面典雅、简洁,并采用了大量留白空间和大幅的满屏图片,营造出能够吸引眼球的大胆设计。

7) Intercom

Intercom服务可帮助用户提高向客户发送电子邮件的效率。其登陆页采用了相对比较复杂的理念以便大家理解产品工作原理以及好处所在。这个设计中我最喜欢的是对比展示旧有工作方式和Intercome的简便方法。

8) iPhone 6

iPhone 6的登陆页面采用了其标志性地营销风格——大量留白、巨型方便阅读的文字和高质量的图片衬托白色背景。不仅如此,公司还加入了相对比较微妙的动画效果——向下滚动鼠标时,手机会以视差的形式自己移动。这一切元素共同组成了一套漂亮、容易领会而且具有苹果风格特色的登陆页。

9)Shyp

Shyp是一款旨在简化包裹发运工作的服务。其流程是首先用手机应用拍摄物品照片,准备发运,然后Shyp会负责完成剩下全部工作。考虑到这个想法比较不寻常,所以需要比较复杂的解释工作来展现出这项服务的简单和直接,而这也就是登陆页面的作用了。用户滚动鼠标时,可以看到分步骤的服务流程,并领会到这一切有多简单和方便。

11) DISQUS

Disqus可通过嵌入代码帮助网站所有方在网站任意位置添加评论功能。Disqus一直崇尚创意、巧妙并且设计精巧的登陆页,而其最新的登陆页版本又加入了一个新元素:个性化。其将主页的标题部分打造成了一个不同寻常、有趣且好玩的评论幻灯片,给整体设计精美的页面带来了另一丝魅力。

12) CAMPAIGN MONITOR

打造简单雅致的登陆页面看似简单做起来难,但是Campaign Monitor出手不凡。这是我印象中最简单但最漂亮的页面。其同样踏中了最正确的节奏:有力的标题、撰写得当的介绍语准确说明软件的好处、显眼的操作引导以及一片正在使用其软件的知名公司名称。

13) Human

Human是一款能够跟踪健身水平、卡路里摄入等的iPhone应用。其推广产品的登陆页面在一定程度上采纳了苹果的设计风格,使用了大型的文字、大量留白和巨大粗犷的图片。其简约的设计一笔到位,没有废话,而且看起来也很不错。

14) CIRCLE

Circle是一项比较新颖的服务,其可辅助你使用比特币买东西。公司登陆页面有几个方面做得非常好,比如在多个位置放置注册表单,而不是单独跳出页面。另外,其还采用了几个其他设计诀窍。鼠标滚动时,其背景图片上采用了比较聪明的视差效果,但大型的图片并不会原地不动,而是会缩小到远景,营造出不同寻常的运动感。

15) DYSON 360 EYE

Dyson正式揭开了其机器人吸尘器Dyson 360 Eye的面纱。其登陆页面采用绝妙而不同寻常的方式展现了其不同寻常的产品。页面在显眼位置展示了成品,鼠标滚动采用了有趣的动画效果展示每个零部件,以便用户仔细查看吸尘器内部构造。而最后就组成了这一信息满满而又十分有趣的产品展示登陆页面。

【优设热门免费资源打包合集】

给2014年划上最后的句号,颁奖大典:
《年度颁奖盛典!2014年最受欢迎的设计资源大盘点》

短短两天人气爆棚的精品PSD文件免费打包!
《年底资源包!27个优质的PSD精品资源免费下载》

设计圈干货全方位搜罗!总有一款亮到你!
《圣诞节大福利!十二月设计圈免费资源大合集》

原文地址:webdesignerdepot
译文地址:uec.nq
译者:蒋灿

【优设网 原创文章 投稿邮箱:2650232288@qq.com】

================关于优设网================
“优设网uisdc.com“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/
设计微博:拥有粉丝量91万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗?
添加 优秀网页设计 微信号:【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加:

sdcweixin

优设大课堂

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:https://www.uisdc.com/14-outstanding-landing-page-design

发表评论 加载中....

评论加载中....

uisdc

评论区都快饿瘪了,看看我期盼的小眼神...

sketch UI 转场动效 界面设计 平面设计 交互设计师 设计师 扁平化设计 排版布局 设计师专访 职场 视觉设计 设计流程 用户体验设计 素材下载 配色 web前端开发 AI教程 海报设计 设计理论 字体下载 神器下载 设计规范 设计趋势 产品设计 动效设计 psd下载 图标设计 logo设计 神器推荐 ICON 职场规划 App设计 字体设计 酷站推荐 交互设计 ui设计 设计师职场 优秀网页设计 用户体验 ps技巧 酷站 PS教程 网页设计 经验分享
wechat

优设官方微信

50万设计师关注

微信号:youshege

把好文章收藏到微信

打开微信,扫码分享
学设计 优设网 在这里