视觉交互都超棒！20多个风格多样的日式企业网站设计

我想很多设计师都认同或喜欢日本的设计，不管是建筑、产品、包装，在网页设计方面，也有值得我们学习的地方。

今天精选了20+日式 Web Design 作品，有餐饮、产品专题页、互联网、设计工作室等行业，从这些案例可以看出设计师是绞尽脑汁去设计好一个网站，而不是简单的「美观」，除了做到精美、大胆的网页布局，同时还增添一些细节交互动效，使网页变得更加精彩。

下面大家一起来欣赏这20个漂亮的日本网站，请不要光看，要懂得「思考」，这就是高级设计师与初级设计师的区别。

500 Colored Pencils

一支彩铅都要做这么漂亮的专题页，可见日本对设计、对品牌包装的重视程度。左右滑动的 JS 特效很好玩，看到这500支彩铅，小编也有点心动了

G-A

话说只有设计水平到一定程度后，才这么大胆做这种设计吧？

Kirin

这是一家餐饮企业的品牌网站，很少餐饮企业愿意花这么多精力和资金做一个品牌网站，可见日本对设计的重视和大陆不是一个档次。。

kirin 里面的很多大胆排版方式很漂亮，像是 VI 手册般的平面设计，但又比 VI 好一点，因为多了些动态效果，还有个强大之处就是，这排版还支持响应式。

SERAKU

这是一家互联网机构，网站采用了双语言（日语+英文），以日式插画作为首屏页面，让首页拥有强大的视觉吸引力。网站的英文字体、数字没有使用系统自带，而是其它嵌入式字体，以视觉优先。

Gina

Gina 也是一个餐饮食品网站，这个首页的视觉离不开摄影师的功劳，漂亮的摆拍摄影让首页增添不少美感。

Toshin-Sekai

一家网站杂志媒体网站，日后你要设计信息类的网站，这个时尚版式是不错的参考对象。

网站的导航菜单直接隐藏了，采用「面包屑」导航，展开后，是这样子：

Udatsu

单单是用鼠标移动左侧导航的哪一个细微交互，这也已经很不错了。要懂得思考啊，同学们。

Newgraduate

简约时尚的网页设计。

Carborocco

干净的页面布局，有时候只用图片排版可能会很单调，比如有些地方空白太多，所以设计师就加了一些图形来做点缀，每个页面都很 nice，所以不要光看首页，其它页面也点点看哦！

B-Monster

上面的排版太过有特色？太个性？好吧，来个中规中矩的给你看。

Tamanabokujo

手绘风格的导航设计也是很有意思哦。

Aozoramokuzai

也是中规中矩的页面排法，这种网站 Banner 的视觉也重要。这家木材厂的横幅就使用了视频来做，效果也相当不错。

Danielspatzek

一个设计师的个人网站，创意十足呢！特别是动效超 cool，实现起来估计也相当麻烦的。（但这个不是日本网站）

Foodfloor

美食 APP 着陆页的设计

Orangina

只彩2种颜色搭配的网站，蓝色+黄色，效果也很棒呢，你怎么看？

Kirameki Dental Land

一家专注儿童牙齿健康机构的网站，导航使用了与 LOGO 相衬的多彩点缀，使整体视觉看起来活跃不少。

Suzuka 2017 专题页设计

Kyoeiseicha

kyoeiseicha 是一家卖茶的企业品牌，网站采用自然界的绿色作为主色，首屏 Banner 使用了不规则的形状图案，还有就是图像方面也用上了「高清图片」的质量，这才能使得网页看起来不会低端、劣质，以后记得不要省那几个流量啦！

Koshibasaki

某明星的介绍页

Descente

Kenjiokabe

静静的用图片记录生活点滴：

以上优秀 Website 均摘自设计导航推荐的：MUUUUU, 4db, straightline 以及 81-web日本网页设计画廊，大家有空的时候不妨到这里找找日本的网站灵感。

「学好点线面，网页设计不会差」

1. 《平面设计中如何用“点”提高视觉张力？》
2. 《实战教程！聊聊平面构成中线的风格和玩法》
3. 《设计基础功！聊聊平面构成中的点线面（超多案例）》
4. 《实战教程第二弹！聊聊平面构成中「面」的风格和玩法》

【优设网 原创文章 投稿邮箱：yuan@uisdc.com】

================关于优设网================
"优设网uisdc.com"是国内人气最高的网页设计师学习平台，专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书：史上最全的设计师图书导航：http://hao.uisdc.com/book/。
设计微博：拥有粉丝量200万的人气微博@优秀网页设计 ，欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航：全球顶尖设计网站推荐，设计师必备导航：http://hao.uisdc.com