Prototype · not production ← 原型总目录
HonestQR

QR Generator Redesign · 竞品源码级 UI 复刻波次 · 2026-08

生成器重设计：竞品拆解 + 三版可点击原型

基于 QR Code Monkey / QR Tiger / Uniqode / qr-code-generator.com（Bitly）四家头部竞品的真实页面拆解，产出三版 HonestQR 品牌高保真原型。参考的是结构与交互模式，未复制竞品素材/文案/logo，未编造数据。每页支持明/暗切换与桌面 1440 / 移动 390。

v2 · 老板反馈迭代 · 2026-08

v2：品牌升级 + Monkey 式拟态化工具窗口

按老板反馈：① 三版原创新 Logo/VI 方向（含明暗版、favicon 预览、配色系统）；② 每个品牌方向配一个整页原型（导航/hero/功能区/页脚全部重做）；③ 生成器完整复刻 QR Code Monkey 的「独立成型工具窗口」形态——自带边框阴影的 app 化容器，窗口内标签行切类型、左折叠面板 + 右预览列、底部工具条与外凸模板页签，并融入像素艺术码标签与永不过期徽标。

Brand

三版 Logo/VI 方向并排

定影 Fixpoint / 像素印 PixelStamp / 墨石印章 InkSeal，含明暗标志、favicon 尺寸与配色系统。

D1

「定影」整页原型

现代 SaaS 工具感，延续青绿；迁移成本最低。

桌面移动 390暗色

D2

「像素印」整页原型

复古像素游戏感，珊瑚橙×奶油纸，放大像素艺术码差异化。

桌面移动 390暗色

D3

「墨石印章」整页原型

印刷凭证感，墨绿×米纸，主打「永不过期」信任承诺。

桌面移动 390暗色
左：v2 D1 拟态工具窗口 · 右：QR Code Monkey 生成器窗口实拍（形态复刻对照）

三版原型

每版含桌面/移动/暗色三种查看方式，原型间可互跳（页头版本切换条）。

Version A

单页折叠面板流

参考 QR Code Monkey：顶部码类型标签行 + 左侧「内容→颜色→Logo→样式」折叠手风琴 + 右侧常驻预览与尺寸滑杆。一屏完成全部操作，效率最高。

桌面 1440 移动 390 暗色

Version B

四步引导流

参考 QR Tiger 类型卡片墙 + Uniqode 定制标签组 + Bitly 三步教学：1 选类型 → 2 填内容 → 3 定制 → 4 下载，步骤条可点击回退，对新手最友好。

桌面 1440 移动 390 暗色

Version C

现有布局增强版

在 HonestQR 现有单卡布局上做增强：模板起步 + Uniqode 式定制标签组（模板/Logo/样式/边框）+ Bitly 式下载格式下拉，改动成本最低。

桌面 1440 移动 390 暗色

竞品拆解文档

四家竞品逐页截图 + DOM/CSS 审查 + 结构图 + 可借鉴点清单 + 四家对比表。

📋 竞品对比拆解：Monkey / Tiger / Uniqode / Bitly QRCG →

与竞品并排对比

左：HonestQR 原型 · 右：所参考竞品实拍（2026-08-04）。

版本A（折叠面板流） vs QR Code Monkey
版本B 第1步（类型卡片墙） vs QR Tiger
版本B 第3步（定制标签组） vs Uniqode
版本C（布局增强） vs qr-code-generator.com

设计红线（已遵守）