界面设计

UI-SKILLS的10种顶级UI设计风格让AI生成界面从土味变惊艳！

Vedu 发布于 2026-04-12

用AI做UI，最大的痛点不是”画不出来”，而是画出来不像那个味儿。想让AI生成Linear风格的深色极简界面，结果出来一个五颜六色的花哨界面？想让AI输出Apple式的戏剧感设计，结果出来一个平平无奇的中规中矩版？问题不在AI不够强，而在于没有给它准...

Vedu 发布于 2026-03-21

在 Chrome 刚刚发布的 146 版本中，加入了一项很有意思的实验能力：WebMCP。简单总结就是：网页可以直接把自己的能力暴露给 AI Agent 调用。过去 AI 想操作网页，只能模拟人的操作；而 WebMCP 的思路是：让网页直接提供“函数接口”。 AI 不再操作 ...

Vedu 发布于 2023-02-23

本文介绍 Skeleton 源码一共只有 419 行（加上注释和换行），非常适合用来学习。本文是根据我的学习过程来编写的，几乎每个章节都包含使用方法和源码分析。虽然现在大部分业务都不需要重复造轮子了，但对于小白来说，学习完 Skeleton 源码是能走出新手村的。本...

Vedu 发布于 2022-11-04

作为一名交互设计师，我经历过国内零售电商产品，后又从进口转战出口。用户群从国内用户变成欧美用户，一开始固执地保留着很多“中式”设计方式，导致我屡屡碰壁。其实中西方电商网站在体验设计上有很多显著差异，而造成这些差异的原因是非常值得讨论的。下面从几个区别点展开讨论，希望可以给大家带...

Vedu 发布于 2022-09-24

目前svelte.js框架已经受到越来越多的前端开发者的关注。但是基于svelte开发的UI组件库及后台管理系统却比较少。由于前段时间有开发一个svelte-ui组件库，所以趁着捣鼓了一个基础版的后台管理系统svelte-admin。 Svelte Ui Admin 基于 Sv...

Vedu 发布于 2022-09-21

本文分享一些非常好用的CSS代码片段，它们很短但功能强大。使用这些代码，我们可以立即提高网站的体验。下面是11个非常好用的CSS代码片段： 1. Scroll behavior平滑滚动 html { scroll-behavior: smooth; } 这行简单的代码可以避免编写...

Vedu 发布于 2021-10-11

一提起图标，大家可能第一个会想到PS、美工等词语，但很多小图标现在根本都不需要再打开PS了。 1、常见的括号（前进或后退“>” ） .arrow{ width:12rpx; height:12rpx; border-top:1px solid #999; border-r...

标签：css

Vedu 发布于 2021-09-09

一个 CSS3 loading 动画库，简单易用，动画流畅，无论是学习还是使用，都很不错。关于 Loaders.css Loaders.css 是一个性能出色的 web 前端代码库，或者叫 CSS 库，因为它完全没有用到一行 js 代码或者图片，仅仅利用纯 CSS 就实现多种样...

Vedu 发布于 2021-09-07

click的300ms延迟响应延迟是由双击缩放导致的，当用户点击一次屏幕之后，浏览器并不能立刻判断用户是确实要打开这个链接，还是想要双击操作。因此，移动端浏览器就等待了300ms，以判断用户是否再次点击了屏幕。问题：300ms的延迟无法接受！怎么解决？「禁止缩放」和「 ...

Vedu 发布于 2021-09-05

图像延迟加载想要得到更好的性能体验，只靠资源压缩与恰当的文件格式选型，是很难满足期望的。我们还需要针对资源加载过程进行优化。什么是延迟加载？下图是京东商城的手机端首页，当元素没有滑动到视线内时，图片src属性放置了一个很小的图片，init_src属性放置了真正的图片，只要当...