子弹笔记排版灵感 - 模板展示
展示多种子弹笔记的周计划、月计划、习惯追踪排版,供手帐爱好者参考。
UD5工具箱
为UI设计师和插画师提供每日练习灵感,随机生成设计挑战题目,保持创意敏锐度
每日设计挑战是一种自律性练习方式,设计师每天完成一个简短的设计任务(通常30-90分钟),主题涉及UI界面、插画、LOGO、海报等。参与每日挑战有助于:①保持创意敏锐度——定期练习防止思维僵化;②积累作品集——持续产出可展示的作品;③突破舒适区——随机题目迫使你尝试不熟悉的风格和领域;④形成设计习惯——将设计练习融入日常生活。许多知名设计师如Daily UI的参与者都通过这种方式显著提升了设计能力。
UI设计挑战侧重于界面设计,包括:登录页、仪表盘、商品卡片、搜索界面等数字化产品界面。重点考察信息架构、交互逻辑、视觉层次和用户体验。常用工具:Figma、Sketch、Adobe XD。
插画挑战侧重于图形创作,包括:角色设计、场景插画、图标系列等。重点考察构图能力、色彩运用、造型表达和风格化表现。常用工具:Procreate、Illustrator、Photoshop。
两者也有交叉领域,如APP启动页插画、品牌吉祥物设计等,需要兼顾UI规范和插画表现力。
高效利用设计挑战的5个建议:
① 设定时间限制——使用计时器(本工具内置),控制在30-90分钟内完成,模拟真实工作节奏;
② 先构思后动手——花5-10分钟做头脑风暴和参考收集(推荐Dribbble、Behance、Pinterest);
③ 遵循约束条件——如限定颜色数量、特定风格等,约束激发创意;
④ 记录创作过程——保存设计稿并写下设计思路,便于复盘;
⑤ 定期回顾对比——每月回看自己的作品,观察进步轨迹。本工具的历史记录功能可帮助你追踪练习历程。
本工具的难度分级标准:
🔰 初级——适合设计新手和学生。题目通常涉及单一页面、常见组件(如登录页、个人资料卡),风格要求较通用,约束条件宽松。
🔶 中级——适合有一定经验的设计师。题目涉及多页面流程、复杂交互(如仪表盘、搜索结果页),风格要求具体,约束条件增加。
🔴 高级——适合资深设计师。题目涉及完整产品设计、创新交互模式,可能需要考虑动效、无障碍设计、多端适配等高级需求。
建议从初级开始,逐步挑战更高难度,确保练习效果最大化。
本工具为每个挑战提供一组建议配色方案(5种颜色),点击色块可复制色值。
60-30-10配色规则是室内设计和UI设计中广泛使用的经典法则:
• 60% 主色——占据最大面积,通常用于背景色,奠定整体基调;
• 30% 辅助色——用于重要区域如卡片、导航栏,与主色形成对比或呼应;
• 10% 强调色——用于CTA按钮、关键图标等,起到点睛作用。
例如:白色背景(60%) + 浅灰卡片(30%) + 品牌蓝按钮(10%),这是许多SaaS产品的经典配色结构。
玻璃态(Glassmorphism)——2020年后流行的设计趋势,特点:半透明背景、模糊效果(backdrop-filter: blur())、柔和边框、多层叠加营造深度感。典型应用:macOS Big Sur及以上版本的界面、iOS控制中心。适合现代科技类产品。
新拟态(Neumorphism)——结合了扁平设计和拟物化的特点,通过柔和的阴影(通常使用box-shadow的inset+outset组合)营造微凸或微凹的浮雕效果。适合卡片、按钮、滑块等组件。但需注意对比度问题,不适合大面积使用。
两种风格都需要精心处理光影关系,对设计师的细节把控能力要求较高。
推荐工具清单:
🎨 UI设计——Figma(免费、协作、插件丰富)、Sketch(Mac端经典)、Adobe XD、Penpot(开源替代);
🖌️ 插画绘制——Procreate(iPad首选)、Adobe Illustrator(矢量)、Affinity Designer、Clip Studio Paint;
🖼️ LOGO/图标——Illustrator、Figma、Inkscape(免费开源);
📐 海报设计——Photoshop、Canva(快速出图)、Affinity Photo;
🌈 配色参考——Coolors.co、Adobe Color、Palettte.app;
📚 灵感来源——Dribbble、Behance、Pinterest、Mobbin(真实APP截图参考)。
将挑战作品整理为专业作品集的步骤:
① 精选作品——挑选10-15个最佳挑战作品,质量>数量;
② 统一排版——使用一致的展示模板,包含:最终效果图、设计说明、配色方案、设计过程截图;
③ 讲述故事——每个作品附上简短的设计思路:挑战要求→设计决策→遇到的问题→解决方案;
④ 分类展示——按类型(UI/插画/LOGO)或风格分类,展示设计广度;
⑤ 发布平台——Behance、Dribbble、个人网站(推荐Framer或Webflow搭建)、Notion页面均可。
持续30天以上的挑战系列(如#DailyUI 30天)本身就是一个很好的作品集主题。
突破设计瓶颈的实用方法:
💡 降低难度——切换到初级挑战,先完成再完美;
🔍 大量参考——在Pinterest/Dribbble搜索相关关键词,收集20+参考图;
⏱️ 限时快速草图——给自己15分钟画3个快速方案(Crazy 8s方法);
🔄 换个类型——如果UI卡住了,试试插画挑战换换思路;
👥 寻求反馈——在设计社群(如设计导航、即刻设计圈)分享半成品获取建议;
📝 写下约束——把约束条件列出来,逐条对照,有时限制反而激发创意。本工具的随机刷新功能可以帮你快速切换题目,避免在单一题目上过度纠结。
暗黑模式设计的关键原则:
🌙 不要纯黑背景——使用深灰色(#121212到#1E1E1E),纯黑(#000)对比度过高导致眼睛疲劳;
📐 调整阴影——暗黑模式下阴影不明显,需使用更亮的边框或微弱的光晕来区分层次;
🎨 降低饱和度——鲜艳颜色在深色背景上会更刺眼,建议将饱和度降低10-30%;
📝 文字对比度——白色文字不应是纯白(#FFF),建议使用#E0E0E0到#F5F5F5,符合WCAG AA标准(对比度≥4.5:1);
🔄 图标适配——原本为浅色背景设计的图标在暗黑模式下可能看不清,需要调整或提供两套图标。
Material Design和Apple HIG都有详细的暗黑模式设计指南,建议参考。
展示多种子弹笔记的周计划、月计划、习惯追踪排版,供手帐爱好者参考。
精选数百种流行渐变配色,点击即复制CSS代码,用于网页或应用背景。
上传多张图片,自由拖拽布局拼贴情绪板,可导出为图片保存。
内置多种轻短的通知声音,点击试听,选择配套项目使用(提供Base64代码)。
上传图片并在白色、黑色、透明等背景上预览效果,辅助电商首图或UI元素设计。
上传图片随意摆放、缩放、旋转,创建个人愿景或情绪板。
选择算法并随机生成数组,以彩色条动画展示排序过程,帮助理解算法。
随机生成包含主角、场景与冲突的写作提示,拯救空白文档,激发创作欲。
上传序列帧图片,合成spritesheet并生成对应CSS steps()帧动画代码。
通过调整深色背景与前景色的对比度,生成符合无障碍标准的深色主题色彩方案。
设置浏览器标题和图标,模拟在暗色/亮色主题下标签栏的样子。
在单页内模拟MPA过渡效果,自定义进场/出场动画,体验View Transitions API丝滑切换。
将照片处理为类似卡通或漫画风格,结合双边滤波和边缘强化的模拟。
粘贴自定义图标字体的Unicode,调节尺寸颜色立即查看效果。
上传GIF并自动水平平铺提取各帧,生成对应的CSS精灵图定位代码。
定义字段名称和类型(姓名、邮箱、数字范围等),批量生成符合规则的 JSON 模拟数据。
构建二叉树节点,动态演示三种深度优先遍历顺序及逐层遍历。
输入行与列的线索数字,自动求解逻辑绘图谜题并显示像素图。
在Canvas画一个日常物品,内建简易识别尝试猜出画的是什么。
选择简约图标库,搭配字体与颜色,导出PNG简易Logo。
使用 SAM 或其他前端模型,点击图片中的对象区域实现像素级分割,体验智能抠图。
提供深刻问题如“真正让你快乐的事是什么”,激发深度日记写作。
输入链接,上传Logo嵌入中心,选择颜色与模板,生成个性化高容错艺术码。
上传照片,通过边缘检测和纹理叠加转换为逼真的铅笔素描风格图片,可调节线条密度。
用密集的交叉线条重绘图片,光影由线条的粗细和密度决定,模拟版画排线风格。
上传背景图,输入大号口号文字,生成传统励志海报风格图片。
交互式调整滚动条宽度、滑块颜色、圆角等,预览容器滚动效果,复制::-webkit-scrollbar代码。
选择对称组类型(p6m, p4m 等),绘制基础形状并自动生成无限重复的几何图案。
上传 GIF 动画,提取每一帧并拼接为单张精灵表图片,可设置排列方式,用于游戏开发。
在图像上点击,利用前端模型将点击范围内的主要物体自动从背景分离。