- 18个最具有情怀的“关于我们”页面设计
- 来源:Mockplus摹客
一个成功的“关于我们”不仅仅是将品牌、公司和团队信息填满一个页面那么简单粗暴,你需要将团队和品牌视作一个整体,呈现出独有的风格,不同的个性,让用户记住。它不仅仅是展示公司的服务理念,更是让你的用户更加了解你的唯一途径。如果你还在困惑怎么设计一个具有情怀的“关于我们”界面,那么不凡看看别人都是怎么做的吧:
首先,先了解下这10个“关于我们”界面设计技巧:
1. 明确告诉用户你是做什么的
2. 清晰的信息排版布局
3. 增加地图模块和数据来提高真实性
4. 获奖信息的展示可以增强用户信任感
5. 团队以及个人真实照片的展现
6. 明显的CTA让用户可以随时体验产品
7. 不要放置毫无意义且冗长的信息
8. 向用户展示你的特色信息
9. 附有个性的设计可以让用户眼前一亮
10. 干净的布局和简洁的设计更让人喜欢
10个真实的“关于我们”界面案列设计
1. https://www.website.com/about-us/
整个页面是以灰白以主色调,同时宣导了这个公司的品牌故事、品牌价值以及真实的数据支撑。往下滚动会看到一个明显的蓝色的CTA让用户可以更加深入的了解产品并且试用。虽然页面上并没有放置公司管理人员或者职员的照片,但整个页面简洁干净易于浏览,并不会影响用户对这个公司的影响。
2. https://www.starbucks.com/about-us
Starbucks的“关于我们”页面可以说是非常简单,几句意味深长的语句很抓住人心,“我们的宗旨就是为客户提供全世界最好喝的咖啡”。左侧的富有年代感的照片让我们了解了它的历史悠久。右侧点击链接则有具体的关于Starbucks的公司特色信息和传统文化等。整个页面虽然文字少,但是产品已经深入人心了。
3. https://www.tumblr.com/about
Tumblr的“关于我们”页面设计的非常标准化,一张大图logo显示公司的标志。图片下方是具体的网站数据:博客数和文章数量。接下来就是简洁的文字来传递公司的服务宗旨和理念,最棒的是在底部有最近发布的文章推荐,它们真的是为留住用户想尽了一切办法。
4. https://www.salsajeans.com/en/about-the-brand/abou...
Salsa是一个服装网站,在“关于我们”的页面直接展示给我们的是一个2分多钟的介绍视频,从设计到制作,整个视频传达他们优良的工艺和公司服务宗旨。并且使用视频解说,用户停留时间更长,更容易达成转化,这就是他们聪明的一点。往下滚动可以看到公司的三大宗旨:Vision,Value,Mission。
5. https://www.thoughtworks.com/about-us
“关于”我们页面设计就是为让用户更加了解我们是谁?我们是做什么的?这个页面的设计完美了诠释了这两点。上方放置了一张团队的照片。告诉访问者了解你的网站背后是有一群真实的人,而非机器。页面上的信息排版想当顺畅,告诉用户公司的服务宗旨和理念,还让我们了解了公司运营。当然,你会看到公司领导层的照片,也是告诉用户这个公司是谁在运作的,证明公司的真实性。底部还有公司最新的咨询来留住用户不离开网站。
6. https://www.odoo.com/page/about-us
Odoo的“关于我们”页面设计除了公司的传递的服务理念和宗旨以外,还有地图展示每个公司办公地址增加真实性。如果你想要用户更了解你们的公司?更信赖你们的公司?那么公司在外获得奖必须要展示出来,这样用户才能更加信赖你们,达成的转化就会更高。Odoo就做到了这点。
7. https://www.sulzer.com/en/about-us
“关于我们”页面必须是易于浏览的,又不要给与用户毫无意义的冗余信息。用户对文字只是浏览,太多的信息内容让他不知道点哪里。Sulzer就采用了很聪明的排版方式,以图片文字链接的形式横向排列公司的介绍以及信息等,你如果愿意了解更多,那么可以点击了解。不愿意了解更多那么可以忽略,可以给用户更多选择。
8. https://www.kittiescakes.com/story
复古风格是我个人十分钟爱的一种设计风格。通常我们看到的复古风都拥有着温暖色色调和俏皮的插画,在配上传统的布局手法,就堪称完美了。Kittie’s Cakes 的页面中散落着许多简单但是极为欢快有趣的插画,这些天马行空的配图让整个设计一下就拥有了强烈的风格和个人特色。复古的配色和层次丰富的页面结构,让用户在获取信息的同时还不时地收到惊喜。
9. https://www.dropbox.com/about
以动图的形式展示展示网站的信息,用色大胆,个性鲜明,让人留下深刻的印象。文字排版主要是以黑红为主色调,红色总是给人一种热情洋溢的心情,也显示出文字内容的重要性。
10. //featherandstone.co/fine-art-wedding-photogr...
完全不同于其他的页面设计,Feather and Stone 的关于我们页面采用了手绘插画来表现他们的独特之处。由于他们是婚礼摄影师,所以这种浪漫的表现手法就显得恰到好处。
Dribbble上8个最佳的“关于我们”界面设计
About Page
Auri About Page
DGiT - About us design
Digital Agency About Page
Dustin-putnam
IIoT Corporate Website About Us Page Animation
Namibia Park About Us Page
Unfold - About Page
看了这么多优秀的设计,是时候该你上场设计一个属于你的个性““关于我们”页面,只需要一个简单易上手的原型设计工具就可以帮你搞定。Mockplus是一款简单无需学习成本的网页原型设计工具,可创建网页项目,自由项目,自定义项目,APP项目等。不论是做页面滚动和排版布局,Mockplus封装的200个组件轻松实现交互设计。如果你需要一套严格的设计规范来管理你的页面,那么摹客的设计系统是你不二的选择,轻松管理你的设计资源。
总结
不论是采用大胆的用色,夸张的动效;还是使用简单的插画,温暖的配色等,都要于整个网站页面设计风格一致。对于许多网站来说,“关于我们” 界面的好坏直接影响了用户的去留,想要让用户能够有更好地“第二印象”,可以多参考下其他网站是如何做的。希望这篇文章可以帮助你。
设计
-
-
- 台湾设计师王志弘的字体设计
- 今天欣赏一组来自宝岛台湾的设计师王志弘的字体设计作品~
- 设食计
-
-
-
- 中文字体也能设计的很好看
- 分享一组创意的中文字体集LOGO设计正确有效的汉子设计也能变化多样,还有有品质感。
- 朴琢品牌设计
-
-
-
- 国际品牌LOGO设计合集
- 分享一组国际范LOGO设计集锦,收好!
- 朴琢品牌设计
-
-
-
- 「MHD妙合分享」BrainPlus格丁尼亚诊所品牌VI视觉设计欣赏
- BrainPlus格丁尼亚诊所品牌VI视觉设计欣赏。
- MHD妙合
-
-
-
- 超详细!Photoshop CC2018快捷键大全
- Photoshop CC2018快捷键汇总,篇幅较长,建议先收藏,以后有需要了随时可以查看 一、工具箱 (多种工具共用一个快捷键的可同时按【Shift】加此快捷键选取)矩形、椭圆选框工具 【M】 移动
- 摄脉
-
-
-
- 平面设计难学吗?学出来好找工作吗?
- 随着平面设计这个行业的快速发展,越来越多零基础的转行学平面设计,然而很多刚接触平面设计的都觉得平面设计很难学,那平面设计真的很难学吗?小编在这里告诉你,平面设计不难学的,觉得难学只是你没找到正确的学习
- 乐设计乐分享
-
-
-
- 餐饮VI设计|Four Hundred Rabbits披萨店VI设计
- http://www.zoomvi.com/http://www.zoomvi.com/http://www.zoomvi.com/http://www.zoomvi.com/http://www.z
- 卓摩品牌设计
-
-
-
- 18个最具有情怀的“关于我们”页面设计
- 一个成功的“关于我们”不仅仅是将品牌、公司和团队信息填满一个页面那么简单粗暴,你需要将团队和品牌视作一个整体,呈现出独有的风格,不同的个性,让用户记住。它不仅仅是展示公司的服务理念,更是让你的用户更加
- Mockplus摹客
-
-
-
- 签名设计,来一款专属你的签名吧!
- 昨日艺术签名抽写:李景龙曹婧伟连伟民卢建新石志君余志祥刘永刚张文娟郑雷欢迎大家点赞关注评论,每天免费抽写!
- 南枫艺术签名
-
-
-
- 「UG模具设计」柱位及骨位的结构设计
- 在模具设计中,产品的柱位与骨位是最常见的产品特征上,那么设计时要注意些什么呢…1、柱位主要指螺丝柱2、骨位的设计3、需注意的细节问题1)缩水,塑胶原料在模具中由于壁厚不同,材料冷却不同步而导致的一种表
- 青华UG模具部落
-
-
-
- 优秀Logo设计的基本表现技法!
- 文/赵安 黄宗池 标志是将信息转化为图形的视觉语言,是一种超越语言、超越地区、超越国界的具有通用性视觉符号。标志设计的基本元素是点、线、面,标志的设计或简单或复杂、或抽象或具象,最终都可以归纳为点、线
- 设计智造
-
-
-
- 免费艺术签名设计,你留名,他抽写!
- 昨日艺术签名抽写:李庆科徐礼全杨红磊赵雨洁王治文林心玥高吉郑波钟志伟欢迎大家点赞关注评论,每天免费抽写!
- 南枫艺术签名
-
-
-
- 你的名字这样写才更加好看!手写签名,免费帮你设计!
- 最近私信我的朋友太多了,不过小黑还是会尽力帮大家写好签名,下面是帮大家写的签名,请认领!李德龙秦庆海李晓光王俊龙陈悦怡杜禹汐王兴喜欢的朋友点击“关注”小黑,评论留言,或许下一个就是你的名字~~
- 小黑手写
-
-
-
- 超实用的各种排版样式参考大全,纯干货,学会这些,排版不用愁了
- 关注周少说,每天都更新画画教程,免费教大家学画画。平面设计排版、书面设计排版,和模板样式参考,非常实用,快收藏吧更多精彩画画内容,请关注头条号:周少说
- 周少说
-
-
-
- ps cad安装包 附带ps教程 百度云视频
- ps是一款图片处理软件 具有很高的实用性和普及型,所以学习ps成为必不可少的一项技能 而cad同样在建筑.机械等方面也有非常大的作用小编有这些百度云资源,需要的私聊小编噢
- 摩尔影视
-