codavidgarcia commited on
Commit
1ead8c3
·
verified ·
1 Parent(s): fe34b54

Update README.md

Browse files
Files changed (1) hide show
  1. README.md +37 -0
README.md CHANGED
@@ -28,6 +28,43 @@ The goal of this model is **not** to be a frontier / SOTA LLM, but to be a **pra
28
 
29
  ---
30
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
31
  ## Why This Model
32
 
33
  Instead of chasing leaderboard scores, this finetune is designed around a few pragmatic goals:
 
28
 
29
  ---
30
 
31
+ ## Before vs After Finetuning
32
+
33
+ The following comparison shows the difference between the **base Qwen2.5-Coder** and the **finetuned Qwen2.5-Coder-14B-Frontend-UI-Architect** on the **exact same prompt**.
34
+
35
+ ### Prompt used for both generations
36
+
37
+ You can reproduce this comparison with the following prompt:
38
+
39
+ You are a senior UI/UX and frontend engineer; design a complete, modern, visually polished web app dashboard for a productivity SaaS called “NovaBoard” that helps teams organize projects and tasks, and return the full implementation as a single App.tsx file using React, TypeScript, and Tailwind CSS (no external UI libraries or icons). The layout must include a left sidebar with app branding and navigation, a top bar with search and user profile, and a main content area with clearly structured sections for “Today”, “Projects”, and “Activity”, using a clean light theme, strong visual hierarchy (typography, spacing, alignment, and consistent color usage), responsive behavior for mobile and desktop, sensible empty states, and subtle microinteractions (hover states, focus states, pressed states) that make the interface feel refined and production-ready.
40
+
41
+ ### Visual comparison
42
+
43
+ <p align="center">
44
+ <table>
45
+ <tr>
46
+ <th>Base Qwen2.5-Coder (no finetune)</th>
47
+ <th>Qwen2.5-Coder-14B-Frontend-UI-Architect (finetuned)</th>
48
+ </tr>
49
+ <tr>
50
+ <td align="center">
51
+ <img src="https://huggingface.co/codavidgarcia/qwen2.5-coder-14b-frontend-ui-architect-lora/resolve/main/qwen2-5-coder.png" alt="Base Qwen2.5-Coder UI output" width="430" />
52
+ </td>
53
+ <td align="center">
54
+ <img src="https://huggingface.co/codavidgarcia/qwen2.5-coder-14b-frontend-ui-architect-lora/resolve/main/qwen2-5-frontend-arquitect.png" alt="Finetuned UI-Architect model UI output" width="430" />
55
+ </td>
56
+ </tr>
57
+ </table>
58
+ </p>
59
+
60
+ The finetuned model tends to produce:
61
+
62
+ - **Stronger visual hierarchy** (typography, spacing, alignment).
63
+ - **More coherent light-theme dashboard layouts**.
64
+ - **More realistic, production-like React + TypeScript + Tailwind structure**.
65
+ - **Cleaner component organization** for “Today”, “Projects”, and “Activity” sections.
66
+
67
+
68
  ## Why This Model
69
 
70
  Instead of chasing leaderboard scores, this finetune is designed around a few pragmatic goals: