欢迎访问智唯网络!专业H5响应式营销型网站建设、百度seo优化、网络推广服务!
营销之道 干货分享
了解企业新动态,分享前沿的营销推广干货,成长路上,我们携手同行
网站设计News

城市指南网站着陆页如何设计

发布时间:2017:08:27 00:01:42 | 已阅: | 作者:智唯小编 | 来源:智唯网络 | 共 0 条评论

扫一扫
手机访问

本文共有1455个文字,预计阅读时间4分钟
导语
有人说,世界是一本书,不愿远行的人只能读到其中的一页。的确,旅行是我们生命中最有意义的几件事之一,其间我们有机会看见新的风景,遭遇新的事情,结实新的朋友,获得珍贵

有人说,世界是一本书,不愿远行的人只能读到其中的一页。的确,旅行是我们生命中最有意义的几件事之一,其间我们有机会看见新的风景,遭遇新的事情,结实新的朋友,获得珍贵的人生经历。更重要的是,一次愉悦的旅行能够为生活注入能量,获得非同凡响的灵感。今天,旅行比起过去更加方便,其中网络也扮演了极其重要的角色。互联网将不同国家和地区的各种信息散步在整个网络的每一个角落,当你准备出行的时候,只需要稍加搜集就能制定出一个不错的旅行方案。


城市指南网站着陆页如何设计

和许多设计师一样,来自 Tubik Studio 的设计师 Tania Bashkatova 也热衷于穿梭于不同的城市,体验不同的风情,享受不一样的生活。也正是因此,她对于如何将城市的风情和自然的体验结合起来呈现给用户,,有自己独到的想法。而这也促成了今天咱们要聊的“城市指南”(Big City Guide)网站这一概念设计案例研究。


推荐阅读:能够吸引顾客促进成交的4种着陆页设计方案

城市指南网站着陆页如何设计

任务

设计“城市指南”的着陆页,包含其中主要的UI界面,确保新用户引导流程中的整个用户体验足够优秀,引导用户了解它的基本功能。

设计过程

“城市指南”(BCG)是Tubik Studio 的 UI星期五活动中的首个项目,想必在Dribbble 上关注了Tubik Studio 的朋友们都知道我们的这一传统活动。设计是在 UI 星期五 活动中将会有一整天的时间来创建一个特定的概念设计项目,这个项目会有特定的要求,同时设计师也可以自由地将自己的想法和激情融入其中。

而这次的活动当中,概念设计项目所包含的任务,是让设计师整合资源设计出一套着陆页,为用户提供全世界各地的主要城市的信息。在着陆页设计中,设计师通常能够更好地将背景图片的信息呈现能力凸显出来。而Tania 打算为每个城市挑选一张足以传达情绪和氛围的照片,并围绕它来做整个视觉设计。所以,最终她选取的解决方案是在着陆页展示3个城市,以横向滚动轮播图的形式展现,并挑选一套动效来强化展示效果和体验。Tania 选取了三个著名的国家首都,而接下来她要考虑的是如何将这三个风格不同的城市统一到一套视觉设计中来。

城市指南所展示的第一个城市是柏林。这个城市有许多值得一看的景点,这也使得图片的挑选工作量更大了。为了呈现出对的感觉,Tania 最后挑了两张图片作为备选。


城市指南网站着陆页如何设计


城市指南网站着陆页如何设计

虽然这两张图片都有这不错的表现力,但是后者能够更好地表现柏林这个城市的坚实感和未来感,Tania 也更加青睐这张图片。城市的名称位于整个排版设计的中心处,风格大胆有力,可读性良好。柏林的名字和巨塔尖锐的顶端相互接驳,而文字和塔尖相互遮盖的关系,让他们看起来仿佛客观存在于塔尖之上,呈现出一种独特的真实感。

第二个城市选择了马德里。作为西班牙首都,马德里延续自中世纪的建筑群是它最有特色的部分之一。但是这并不正确。马德里是现代欧洲的商业中心之一,所以Tania 决定将它现代化的一面呈现出来。


城市指南网站着陆页如何设计


城市指南网站着陆页如何设计

不过,将现代风格优先纳入到考虑范围内,是出于整体设计一致性的考量,在排版设计上,也延续了柏林页面的设计,城市的名字和图片中的建筑再次融为一体。副标题的文案同样进行了精心的设计,呈现出这个城市活力四射的特征。而这个仿佛漩涡的回廊成为了最终的选择。

不过在这个地方,设计师犯了一个有趣的错误。西班牙首府名为马德里没错,但是美国的爱荷华州也有个马德里,而这张旋转走廊的图其实是来自美国而非西班牙,如果没有去过那个地方,单靠互联网有时候确实很容易犯错。当然,总是有修改机会的。

最后一个城市,Tania 选择了斯德哥尔摩。这同样是一个现代气息浓郁且拥有足够文化积淀的城市。斯德哥尔摩同样是一个个性十足的地方,个性十足的城市风景让Tania 挑花了眼,她尝试了许多不同的图片作为视觉设计的基础。


城市指南网站着陆页如何设计


城市指南网站着陆页如何设计
如何建站:
建网站需要准备哪些资料 如何购买域名空间 协助备案 成功案例 真实见证 建站类型有哪些 收费标准 建站流程 制作周期 改版美化 提升有户体验 [建站必看]源码内容交付 联系客服 专业建站

看了这篇文章的人还看了

专业建站 免费排名(有什么疑问的请留言或咨询在线客服)
  • 全部评论(0
    还没有评论,快来抢沙发吧!

上一篇:从微信「朋友圈三天可见」解析页面设计的原因

下一篇:网页的点线面排版设计

  • 18893 文章总数
  • 2303370访问次数
  • 建站天数
  • 专业建站优化Jimmy Zhu
    男,从事互联网服务行业10年,专业建站优化,快速建站上排名。欢迎中小型企业朋友一起来交流!!
    相关专题
    • 网站建设咨询
    • 同行价格

      统一报价,无隐形消费

    • 金牌服务

      一对一专属顾问,7*24小时金牌服务

    • 售后无忧

      完善售后,客服经理全程跟进

    建站优化二维码
    建站优化二维码

    截屏,微信识别二维码

    微信号:13825575516

    (点击微信号复制,添加好友)

    优化二维码打开微信