web-design-html5-css3-js-tools-1

是时候为网页设计师的来一组便捷的辅助工具了。日新月异的网页技术革新催生了大量的设计与开发工具,HTML5/CSS3几乎成了设网页设计师的必修课,而强大的JS也为网页提供了更多的可能性。尤其是HTML5,作为一门极为有用且实用的标记语言,它赋予网页设计师创造更优秀网页的可能。

这也是为什么,身为网页设计师的你需要不停地了解最新的技术趋势和新兴工具,这些全新的库、框架、插件和技术能让你的网页如虎添翼。

HTML5使得设计师和开发者在各个不同领域都比之前更强大了。快速,漂亮,安全,响应式,这些特性使使得设计师和开发者可以创造出更加强大更富有创意、更快速、性能优异的APP和网页。所以,接下来我所推荐的工具就是帮你搞定这些问题的。

简约的响应式图表 – CHARTIST.JS

由于社区对于图表类JS库的失望,Chartist.js 诞生了。尽管有上百种不同的库可供你选择,但是用它们的时候,你总会碰到意想不到的问题,需要不停调整。

Demo Download

FSVS – 全屏垂直滑块

这是使用jQuery和CSS3写的一个简约全屏垂直滑块组件,支持鼠标混动、点击并托拽,以及触摸手势。

Demo Demo

Nikolay Talanoy 设计的的全屏滑块控件

组件本身的设计令人惊艳,更重要的是它还拥有不错的动效。

Demo

Cody House 设计的大图滑块控件

这是一个横跨屏幕响应式且易于定制的滑块控件。

Demo Download

Elevator.js

Elevator.js 修正了老范儿的回到顶部按钮的效果,如果你非常在意这个细节的设计不妨来试试这个吧。

Demo Download

Pure CSS Questionnaire Concept (hover items)

Demo Download

固定背景特效

这是一个不错的模板,充分利用了background-attachment 的CSS属性来创造固定背景的效果。

Demo Download

使用SVG创造模糊效果

这是一个教程,教你如何借助JS和SVG模糊滤镜在HTML元素上创造模糊效果。

Demo Download

3D 折叠面板

使用jQuery和CSS创造出折叠控制面板的效果,隐藏次要内容。

Demo Download

圆形弹出式导航菜单

使用SASS和CSS3营造出来的过度、变换的动画效果,点击图表,弹出更多选项。

Demo Download

登录框概念设计

Demo Download

交互式托拽色彩概念设计

这是一个颇为好玩的插件,当你在处理网站视觉稿的时候,只需要将色彩腿拽到对应的地方就可以实现着色。

Demo Download

【优设四月最受欢迎的PS教程排行榜】

Top 1:效果超棒的极简风格海报!
《AI+PS新手教程!手把手教你打造简约现代的极简海报》

Top 2:给心爱的妹子画一个Q版头像!
《萌系PS教程!手把手教你打造Q版的个人头像》

Top 3:上帝说,要有光!
《PS高手教程!教你轻松打造效果美到爆的光照效果》

原文地址:graphicdesignjunction
优设译者:@陈子木

「子木说」

代码太多也是困扰,所以最近咱们一直在安利HYPE3。你只需要稍加搜索就可以在优设找到相关文章。另外,依然有同学反映没找到下载。好吧,戳这里下载

本文由优设网原创翻译,请尊重版权和译者成果,转摘请附上优设链接,违者必究。谢谢各位编辑同仁配合。

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

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

sdcweixin

点赞
收藏 1

发表评论 快来秀出你的观点

还可以输入 800 个字
 
 
载入中....
相关推荐
评论 收藏