欢迎来到 WebMagic 仓库！这里汇集了一系列令人惊叹的前端项目，涵盖了HTML5、CSS3和JS等多项技术。无论你是前端开发者、设计师，还是对创意互动内容感兴趣的人，这个仓库都将为你带来无尽的惊喜。
particles.js用来在 web 中创建炫酷的浮动粒子特效。它调用的粒子动画效果，让网页背景更有科技感。颜色还可以任意切换哦。
互联网行业的快速发展使网页设计和网页开发成为热门行业。同时，热门也意味着竞争。网页设计师和网页开发者应该让自己时刻保持竞争力，不断增长自己的设计技能和开发技能，让自己在众多竞争者中脱颖而出。
腾讯云官网作为用户接触腾讯云的第一阵地，官网的气质和第一印象对用户至关重要，这次的图形重塑和技术探索也是对腾讯云的深入的改头换面，我们也把这次看得见的设计和看不见的思考呈现给大家。
动画早就不是早期人们印象中的低龄向玩物了，从早年的卢卡斯影业到今天的工业光魔，动画技术证明了它可以实现无限的可能性；从70年代的高达、EVA到之后的宫崎骏、皮克斯，动画的深度和内涵也早已不弱于电影和文
安利一波CSS、JS炫酷动效在线下载网站 # bttn.css 专注分享网页按钮的样式库 # Hover-Buttons 一个可以生成代码的网站 # granim.js 基于canvas的背景颜色渐变动画插件。该插件通过配置几组不同的颜色方案，使指定元素在这些颜色中执行平滑的渐变色过渡效果。 # micron 可生成炫酷CSS3动画的js动画库插件。通过micron.js插件，你可以为页面的任意DOM元素添加12种炫酷CSS3动画效果。并能通过js代码或html5 data属性来串联各种CSS3动
我们日常所看到的网页设计大多是浅色系和亮色系，作为神秘色系的黑色总给人一种严肃的感觉，它可以很低调，也可以很奢华，但永不过时。
腾讯ISUX isux.tencent.com 社交用户体验设计 今天给大家带来的分享是《AR，我们从设计说起》，希望大家通过这个分享能够快速了解AR的实现原理，AR的设计流程，以及在设计过程中遇到的问题，在最后会分享我这些年做AR设计的一些心得和技巧。 从2013年开始加入腾讯这个大家庭，加入这个大家庭后一直负责QQ相关的设计工作。从2015年开始参与研发短视频APP的设计工作，即是将QQ的社交内容娱乐化，同一些新的技术做结合。 关于AR AR这个词对大众而言并不是一个陌生的词，但是A
上篇我们讲到了《可视化设计-数据时代的美味制造者（上篇）》，分析完了逻辑性的可视化概念与设计流程。
CodeTank是一个非常有趣的竞赛性编程游戏平台，通过几行简单的Javascript代码和CodeTank API，每个人都可以方便的构建属于自己富有智能和个性的坦克（Tank）机器人，并通过互联网进行在线互动和竞赛！
一个合理的布局和清晰的网页可以让访问者感到舒适,并愿意花时间去了解更多的内容，网页设计的设计风格、色彩、页面层次、实用性、交互性、兼容性以及SEO布局等方面，企业在进行网页设计前都是需要考虑的。接下来小编跟你详细分享这8大网页设计注意事项，一起来看看吧。
设计领域时时刻刻在发生着你我意想不到的变化。许多看似熟悉的设计趋势，于不同的设计师而言，经过灵活的创意设计也许就意味着不同的可能性。而这些可能性则来源于设计灵感的持续涌现。及时汲取设计灵感，是设计师们创作优秀网页的秘密武器之一。
首先，我们来看一下HTML结构。代码中只有一个<canvas>元素，这是我们用来绘制粒子特效的画布。我们也可以通过给<canvas>元素设置背景图片来增加更多的效果。
动画效果如今已经深入到 UI界面的每个角落。屏与屏之间的切换因为动效而显得更加连贯，交互的上下文逻辑也因为动效的加持而更加清晰。动效对于产品和用户而言，都是一个不可多得的重要组成部分。
在项目开发中，我们可以通过创造有趣的动画来为我们的项目增加视觉感与用户体验，同时，也为我们的网站增添了独特的美感，而且还提高了用户参与度并创造了令人难忘的第一印象。
北京蓝亚盒子科技有限公司（Layabox）是国家高新科技企业，旗下LayaAir引擎是中国三大引擎之一，尤其是3D小游戏与HTML5领域，引擎占有率超90%。旗下LayaMe是无需编程的游戏互动创意制作工具及平台，在此广招天下之贤士。欢迎转发或者自荐。
一场说走就走的旅行少不了一家精挑细选的酒店。出门在外，没有一个舒适的住处，恐怕旅行的记忆也并不是那么美好。大牌酒店住不起，小众酒店性价比高，但哪家最合适？网上攻略必不可少。 作为主观性非常强的视觉性动物，选择酒店的时候除了看价格，当然也会更看重酒店的网页设计风格。如果酒店的网站设计都乱糟糟，那酒店自身可想而知。作为提升酒店形象的门户，酒店网站设计一定不能马虎。 如何设计具有现代感的酒店网站？个人分析可以从以下几点要素出发： 1. 响应式设计：网站必须支持跨设备浏览。 2. 卓越的用户体验：简化的网站浏览流程
2018年的夏天，俄罗斯举办了为期1个月的世界杯比赛，在比赛期间，QQ推出了“QQ-AR穿越赛场” 主题活动，整体设计利用前沿的AR技术，打造了业界首创的“画圈开启任意门”创新玩法，整体活动吸引了全国373个城市3015万用户成功穿越活动赛场，收获了业界与用户的良好口碑，同时90后参与用户占比83%，充分体现出QQ科技化、年轻化、娱乐化的魅力。
敦煌壁画是我们民族引以为傲的瑰宝 但是它的绚丽正在一点点消失... 腾讯联合王者荣耀和敦煌研究院 最近发起了一个数字供养人计划 希望有更多人了解和热爱敦煌 为壁画的保护尽一份自己的力量 关于这个刷屏级别的H5，小堂妹上周已经跟大家分享过上篇，今天我们接着看看王者荣耀团队是如何打造出这个美轮美奂的作品。 多媒体交互体验&动画设计 这个H5的素材量非常庞大，模块较多，信息量也很大，总体的体验时长大概在3分钟左右，对于h5来说3分钟是一个很长的时间，那我们如何在h5的形式上让用户静静地完成这3分钟的
设计网站时，关于我们页面和联系页面（contact us page）往往是必要页面之一。虽然只是一个简单的页面，但要真的能让用户有联系你的冲动还是很有挑战性。如果说，用户点击了联系页面，用户其实已经在尝试联系你了，这个时候，你需要提供的，不是花哨的设计，而是直观的联系方式，不阻碍用户尝试联系你的行为。但话又说回来，如果你有信心设计得美观，新颖，自然是最好，而且简洁也不意味着简单。今天我和大家分享12个联系我们表单和页面设计模板和例子，如果你喜欢，可以用在你的网页设计里哦。
我们都尝试去观察生活，但是有时却缺少了总结生活；有时我们太着眼细节，忽略了大局。数据和可视化似乎是两个好兄弟，就像仰望星空与脚踏实地的两种状态。
前端之所以有趣，就是每年有比较多新奇的插件和工具让我们去探索和研究。我们在开发前端应用时，自然少不了去找一些第三方插件帮助我们提高开发效率。本文给大家介绍的这50款新工具，都是相当的新，都是去年的新项目，时间不会超过1年，希望通过我的介绍，你能找到适合的工具，应用到项目中。
媒介和技术的发展使设计艺术打破了原本界限：从静到动到可交互，从二维到三维到沉浸体验，技术结合设计形成的审美价值在未来是无止境的。视觉设计师们普遍形成了不断从文化、艺术中汲取风格和元素，采用计算机设计软件结合自定义传达内容在媒介载体上传播的工作模式。然而设计软件赋予了设计绚丽的视觉语言却也限制了内在的可能性：设计在不断反复之前出现的文化浪潮，许多设计因软件功能出现了泛同质化难以应对复杂多变的应用场景。现有的设计语言不够丰富，而生成艺术的发展优化了设计创造力的新路径。正如维拉·莫尔纳所言：“这听起来可能很矛盾
大多数人都知道，一个APP的引导页面还是挺重要的，不过要想通过原生的Android代码做出一个非常炫酷的引导页相对还是比较复杂的，正巧html5在制作炫酷动画网页方面比较给力，我们不妨先利用htm
网页背景设计看似在整个网站的设计中处于一个不起眼的位置。实则，它对于用户的留存性及促进网站转化率方面都起到非常重要的作用。若是网页背景设计不合理，或者图片、色彩运用不当，对于用户而言都是视觉上的灾难。
网页设计作品集对网页设计师而言，既是网页门面，也是个人专业素养的体现。那么在作品集设计上万不能掉以轻心。无论是制作一份简约大方还是极具表现力的精良作品集，设计师们都必须付出十分的努力，参阅大量的设计作品，获得灵感。
有一些网页设计新手会认为，在设计网页的时候最重要的应该是如何添加一些具有吸引力的内容，所以他们只把大量的精力放在内容的设计上。在我看来，内容质量的好坏确实是能够决定你浏览量多少的关键因素，但事实上，页面的排版也是一门非常大的学问。俗话说“红花还需绿叶衬”，其实我觉得两者之间没有轻重之分，是相得益彰的关系。没有绿叶的陪衬，又怎能显出红花的娇贵呢？一个好的网站设计，不仅要求质量好的内容，还必须有整洁干净的页面排版，才能真正地达到良好的用户体验。 网页设计排版VS平面设计排版 网页设计中的排版和平面设计的
Vue过渡和动画让我们网站更具现代感并为网站访问者提供更好的用户体验的好方法。 幸运的是，对于开发人员而言，Vue动画只需几分钟即可完成设置。
前端之所以有趣，就是每年有比较多新奇的插件和工具值得我们去探索和研究。我们在开发前端应用时，自然少不了去找一些第三方插件帮助我们提高开发效率。本文给大家介绍的这50款新工具，都是相当的新，都是去年的新项目，时间不会超过1年，希望通过我的介绍，你能找到适合的工具，应用到项目中。
数据可视化，数据是本质。 其产生与兴起，一方面是由于人们有着对数据的各种对比、趋势、关联等等的诉求；另外一方面，人是视觉动物，对于大量的原始数据不敏感，需要有工具将数据图形化，直观地呈现出来。前端，最贴近用户的程序员，自然而然地肩负着此使命，我们都渴望着准确高效友好地把数据可视化地呈现给用户。 可视化也是一名艺术家，与前端偶遇于web动画中。我们动画常见的是基于CSS和JS的，但我们不应该只局限于此，我们需要对动画了解更多。 即将于10月14日在深圳举办的 IMWeb Conf 2018 中， 《可
一场说走就走的旅行少不了一家精挑细选的酒店。出门在外，没有一个舒适的住处，恐怕旅行的记忆也并不是那么美好。大牌酒店住不起，小众酒店性价比高，但哪家最合适？网上攻略必不可少。
一眼看过去似乎有点少，其实开发web网站只要需求不是特别多的，基本就够了，有些甚至JS都用的少。
懵懂少年有幸受邀参加3.30中国第五届CSS大会分享，感谢业界大咖的不嫌弃，鉴于CSS的更新频率不及JS各种迭代高，新的特性组织起来对于分享的主题会比较散，所以我选择了一个关于动画时间的分享主题，基于大家熟悉的属性提炼出新的用法与思维，用于引导WEB侧动画的制作。
什么是弹框? 弹框是一种交互方式，用作提醒，做决定或者解决某个任务。弹框一般包含一个蒙版，一个主体及一个关闭入口，常见于网页及移动端。其好处是让用户更聚焦，且不用离开当前页面，更快更容易完成任务。由于
最近2年一直在做WebApp相关项目，设计过上百个弹框，其中总结了一些心得，将透过以下文章介绍弹框在Web上的各种应用﹑技巧及表现。 什么是弹框? 弹框是一种交互方式，用作提醒，做决定或者解决某个任务
加载动画可以缓解用户等待页面加载的不适感，给予用户一个明确的指示，告诉他们页面正在加载中。这有助于提升用户体验，减轻用户的焦虑感，让他们 感觉 页面加载速度更快。
点击阅读原文，了解更多关于《IMWeb Conf 2018 可视化与动画分会场》的信息 背景 数据可视化，数据是本质。其产生与兴起，一方面是由于人们有着对数据的各种对比、趋势、关联等等的诉求；另外一方面，人是视觉动物，对于大量的原始数据不敏感，需要有工具将数据图形化，直观地呈现出来。前端，最贴近用户的程序员，自然而然地肩负着此使命，我们都渴望着准确高效友好地把数据可视化地呈现给用户。 可视化也是一名艺术家，与前端偶遇于web动画中。我们动画常见的是基于CSS和JS的，但我们不应该只局限于此，我们需要对动画了
作为一只前端狗，我们的使命就是在满足产品需求、实现交互设计的基础上，将最好的体验呈现给用户爸爸们。在保证性能的同时，我们通常会给页面加一些动态效果，以增强页面的表现力并提升页面的交互体验。故将前端实现动效的几种常用方式整理成此篇小结，以求温故而知新，如有不当还望多多指正。
前段时间，我将精力专注在Web性能领域；在这个领域下有个重要的课题是如何让网页更丝滑（流畅）。
每一个网站都必须有404页面，404页面指的是显示网站错误链接的页面，可能是该访问的页面不存在，也可能是页面已经被删除。
腾讯设计周（TDW）由腾讯设计通道联合腾讯学堂共同举办，活动形式主要由设计峰会和创意市集组成，基于"DESIGN FOR GOOD"理念，旨在打造一年一度的设计行业盛会，持续对外传递腾讯的理念、愿景和使命。
如果你打算在2015年重新设计你的网站，那么你可能有必要了解设计优秀网页的趋势。尽可能早地考虑网页设计特点是一个好主意。
编者按：米多娱乐成立于2015年8月，成立仅四个月便获得2000万的天使轮融资，随后的Pre-A轮融资额也达到了千万级别。无论是其制作的鹿晗、汪峰等一线明星的VR演唱会，还是今年央视的中秋晚会VR直播，都给米多娱乐带来了非常好的名声。但真正让米多娱乐在VR圈内“一夕成名”的，却是前不久的“被讨薪”事件。这个被部分媒体放大了的事件，极大的误导了大众及圈内人士对米多娱乐的印象和解读。今天，就让VRPinea谈谈我们眼中的米多娱乐。 关注VRPinea的读者相信对米多娱乐并不陌生，我们曾于今年9月对其进行过厂商专
如今，同类产品竞争越演越烈。用户对产品的第一印象往往决定了一切。而用户的第一印象又起始于引导页。也就是说，引导页的好坏，很大程度上直接影响用户是否最终使用或购买产品。如果设计师能够一开始就添加引人入胜的引导页设计，产品吸引和说服用户使用和购买的机率就会更大。
现在社会，同类产品竞争越演越烈。用户对产品的第一映像往往决定了一切。而用户的第一印象又起始于引导页。也就是说，引导页的好坏，很大程度上直接影响用户是否最终使用或购买产品。所以，如若设计师能够一开始就添加引人入胜的引导页设计，产品吸引和说服用户使用和购买的机率就会更大。
之前有很多人问学好前端需要学习哪些 js 库, 主流框架应该学 vue 还是 react ? 针对这些问题, 笔者来说说自己的看法和学习总结. 首先我觉得在学习任何知识之前必须要有一个明确的学习目标,
腾讯ISUX isux.tencent.com 社交用户体验设计 生动有趣的学习内容，用一条穿越时空的路径慢慢展现出来，让孩子在游玩的过程中学到英语知识，得到有效的学习成长。这次的项目课题是需要引起孩子们的注意，使用上更友善，让他们喜欢成为学习之路上的主角。 分析 静止的场景 学习路径是把课程的内容在模拟的场景中按照循序渐进的方式呈现出来。在梳理原本的场景过程中，发现主要是由场景、人物、课程点（路径）、导航四个要素组成，在每个的路径点上都会承载这个Level的课程内容，发现原本学习路径存在3
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM
