Startup Framework搞定的优秀网页设计欣赏

UI / UI设计 / 网页设计 /      

uimaker
UI设计师 / 江苏 南京

来源:网络   作者:陈子木

关键词

这篇文章是始于一次针对新兴的设计&前端框架Startup Design Framework的探索研究。我们搜集整合了一系列的优秀的初创公司的网站,通过这些案例可以了解这类网站的特征、覆盖范围以及这一工具所提供的各种可能性。

必须承认,这些新兴的网站中越来越多地用到了新的网站搭建工具,这也从侧面反应了网站搭建工具的快速发展。同时,世界各地的开发团队也开始为这些“在线创业者”提供通用的解决方案,这也就意味着不论你是想借助博客分享想法,还是推广自己的服务或产品,都可以从中找到合适的方案来落实你的需求。比如Startup Design Framework 就是个不错的工具。

不同于传统同类工具,一个元素一个元素的搭建方式,在Startup Design Framework 中,,你可以逐个区块地快速搭建布局。人人都可以是设计师不假,但是并非人人都是优秀的设计师。创建网站并不难,但是要让细节精致到位并非谁都可以。Startup Design Framework 的区块中大多包含了扁平化UI、充满吸引力的视觉组件以及良好的执行力,让用户不用纠结于组件的搭配和细节。另外,Bootstrap模板的加入也意味着用户不需要为响应式设计而烦恼。

下面的42个案例足以让你明白Startup Design Framework的优秀之处。

Crunch Commerce

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

Crunch Commerce 网站布局非常直观,横向上并未分栏,尽可能将内容清晰地呈现出来。纵向一列到底的布局使得网站的响应式变化非常直接,适配不同屏幕尺寸设备都得心应手。这一点和这家初创公司的产品在内涵上高度一致:跨平台通讯,适用所有设备平台。

Recollective

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

和上一个案例类似,扁平化的设计风格令页面内容更加突出,将网页从复杂布局中解脱出来。对比明显而清新的配色,矢量的素材,结构明晰的布局,这些都强化了整个网站的设计。

Bannersnack

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

Bannersnack使用了一些新潮的功能,这些务实高效的功能使得网站更加具有吸引力。布局干净,内容高于一切,合理运用插画点缀,整个外观令人印象深刻。

Zirtual

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

这个网页良好的布局令多媒体内容和文本两者之间得到了平衡,内容排列整齐,格式清晰,视觉效果在整个网站设计中占到了较大的比重,营造出亲切友好的氛围。

Timeneye

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

得益于前景内容和背景图片之间的明显对比,网站能让用户轻松融入氛围并专注于内容,其余部分则很好地补充了整个布局设计。

SHN

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

网站简单明了的布局使得数据更加突出,观点鲜明,并让关键的功能成为了访客专注的焦点。

Jipio

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

Startup Framework 的响应式设计,令网站的开发者不再担心用户在小屏幕上浏览到桌面端网页。灵活的布局让Jipio精准而合理地呈现在不同屏幕上,吸引用户浏览。

Yisual

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

偏平化的风格赋予网站清晰的风貌和智能的布局,精心处理后的数据以人性化的方式展现出来,避免访客迷惑,并让他们参与到网站互动中来。

Digitale Factuur

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

没有 Startup Framework ,像这样需要呈现大量信息内容的项目压根不会推进的如此之顺利。

Winterrain

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

如何使用Startup Framework打造用户体验优秀的网站?Winterrain 就是一个不错的案例。整齐的布局,漂亮的配色,明亮的文字与标题,主次分明,也能够吸引访客的注意力。

PeachDish

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

矢量图形、多样的文字和密集的图片被合理地整合在浅灰背景上,一样不会引起混乱。

het eenzame westen

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

Startup Framework 为网站创造了更多的的可能性。这个网站一样设计的足够清爽整洁,虽然顶部以文本为主,不过图片依然可以在其他的位置各司其职,这同样是一个深思熟虑之后的布局。

Calltacular

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

Startup Framework 搭建下的网站内容还是非常内容的,最关键的是这样的区块搭建方式构建出的视觉流,让用户非常流畅的从头浏览到尾。

PickEvent

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

筛选出合理的区块排版让重点内容成为用户关注的焦点,单页滚动+粘滞跟随式的导航栏,用户浏览更加方便了。

Universal Media

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

像这样包含视频、图片、地图、表格和文本的网站还是非常考校设计师的信息梳理能力,好在借助 Startup Framework ,这个问题得以轻松解决。

FortyAU

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

是否专注设计直接决定了网站的品质。一个真正吸引人且令人印象深刻的网站,通常你会在首页上感受到创新的氛围。

GiftOff

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

GiftOff这个网站绝对会给你一个非常深刻的第一印象。鲜亮的渐变色背景,充满现代风格的详情信息,符合趋势的幽灵按钮,留白让整个空间疏密有致。看起来简单,但是非常值得学习。

Yorkys Brunch

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

Startup Framework其实是一套适用范畴非常广泛的系统,比如这个餐饮网站。大气的背景图,细致的Logo,吊胃口的配色系统,你饿了么?

Bard Spring Fling

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

轻松处理复杂多样的信息是Startup Framework的优势所在,这个网站是另一个实例。另外响应式设计都内置了,你还担心什么呢?也许就剩下调整中文字体了吧。

Vyte

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

这是充分运用Startup Framework的功能的一个不错实例。不用从零开始造轮子,在这里专注内容呈现和整洁精致的布局吧,别的交给Startup Framework就好了。

Visage Payroll

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

合理的布局能够引导用户从头操作到尾,如果你需要案例就看这个网站吧。每个部分的内容和数据都以奇妙的方式呈现出来。设计师沿用了目前正在流行的现代风格,图标和内容都清晰而生多地传递出了用户需要的信息。

Foodliner

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

通过一系列令人垂涎的糕点,网站将美食每一个诱发你分泌口水的角度都呈现在你面前。合理搭配图片和背景,设计师确保网站不会对用户的视觉产生压迫,并成功地调动起了你的胃口。

Jezierski

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

Jezierski 借助Startup Framework 快速搭建起网站头,整体设计采用的是单页式布局,变化多样的内容随后以充满创意的方式展现出来。

Buel

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

用户打开网站的那一刻,充满活力和能量的音乐视频就被呈现出来。当背景采用单色的简约设计之后,文字内容和视频图片视觉关系就更加清晰了,而网站设计师也正好把握了这中间的平衡。

Octoly

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

这是一个在线视频处理的网站,设计简约,这样一来,用户会更加专注于他们要做的事情。

Orbitfy

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

设计师所用的那些微妙但是充满活力的扁平化插画,让网站拥有了瞬间吸引了访客的目光的魔力。

Hubstaff

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

和常见的电商网站不一样,这个网站采用了少见的两栏式布局,不过这样的设计看起来也算自然而直观。网站色调上充满吸引力,扁平化的图形让网站看起来非常现代,总体上为用户提供了舒适的用户体验。

Mail Squad

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

这个网站向我们展示了网站设计的另一种可能性:让图片和文字内容高度协同起来,而不是让其中一个特别突出。

Apartable

Startup Framework搞定的优秀网页设计欣赏,PS教程,思缘教程网

 收藏