推荐可视化设计纯前端应用综合应用
可视化设计合集
拟物阴影,折角彩纸,图标变换,滤镜,遮罩图像,X光透视,裁剪动画,多边形变形,颜色混合
湖上日出
澄澈的湖水娴静而又安详,岸边的水草迎着晨风朝你微微点点头,平铺在水面上荷叶还没睡醒,一动也不动;偶尔冒出几个水泡,划出几道涟漪,打破平静的水面。
忽然间,在远处天水相连的地方一个夺目的太阳冒了出来,带着耀眼的光环,洒下通红的朝霞,把整个天空和湖面都染红了。太阳冉冉升起,给湖面撒下一条条金丝带,鲜艳夺目。
太阳消失在高空,深红的朝霞也渐渐消逝,留下两朵孤云,远处的山峰依旧耸立着,守望着这片湖水。。。
Flex弹性布局
可视化练习Flex弹性布局的各个属性
Grid栅格布局
可视化练习Grid栅格布局的各个属性。
CSS动画
16个动画案例合集,讲解可视化设计过程。
三维动画
通过可视化样式面板设计三维图形,添加旋转动画以便从各个侧面观察其立体效果。
百度计算器
模仿百度计算器,在搜索框里输入计算式子百度一下即可。
非常适合作为入门课程,简单实用。
待办事项
todomvc.com有各种语言实现的《待办事项》小应用,我们也用众触表达式实现了一遍。
业务逻辑直观、通俗易懂,也有足够的细节可以让我们深入到众触核心。
钢琴演奏
一个简易钢琴,弹奏时有良好的动效和音效
立体键盘/盲打练习
仿真笔记本键盘,有漂亮的阴影和立体效果,敲定键盘时有明显的键程和背光反馈。通过盲打练习可以快速熟练键盘,提高打字速度。
中国色
中国传统颜色分类展示,可收藏可复制。
中国象棋人机对战
以表达式和代码混编的方式引入了AI算法,学习表达式如何调用代码的。
学习用画布而非HTML来渲染并控制棋子。
适合高阶学员。
俄罗斯方块
经典俄罗斯方块是经久难忘的游戏,可用电脑键盘快捷键或鼠标点击玩,也可用手机触屏玩;可设置初始行数和难度级别;会自动保存/复原上次玩的场景。对数学要求高,适合已基本掌握众触的开发者。
天空之城
大疆旗下的天空之城(全球航拍爱好者和专业摄影师的作品社区)的仿站习作。
页面排版精美,照搬原站UI,自己写表达式完成业务逻辑,但并不复杂,适合初期学习打基础,表达式讲解得比较细致,囊括了众触平台的大部分概念。
五子棋在线对弈
五子棋是规则简单明了的策略型游戏,先形成五子连线者获胜。
本课程习作采用两人在线对弈的方式进行比赛。
适合进阶型学员。
罗湖图书馆知识竞赛
罗湖图书馆在深圳读书月举办的“相约悠图•探寻历史,激活红色记忆”为主题的云上知识竞赛。
舞台计时器
适用于大型会议、舞台活动、多讲者论坛的计时器。
远程控制演讲者手中手机、舞台屏幕、提词器中的倒计时、议题、即时消息
浏览器起始页
仿自iTab,一个好看又好用的自定义卡片式浏览器新标签页。
精致的iOS式小组件卡片设计让信息一目了然,常用网址随心订制。
Worktile总览
Worktile是专为企业办公场景设计的项目协作管理系统。包括组织架构、网盘、消息、项目、审批等功能。
业务概念多,关系错综复杂;虽然大家很可能不需要做到这种复杂度的应用,但学习里面用到的思想和用法是非常有价值的。