smirki commited on
Commit
82f7c3b
·
verified ·
1 Parent(s): b6f0d65

Update README.md

Browse files
Files changed (1) hide show
  1. README.md +187 -8
README.md CHANGED
@@ -1,14 +1,193 @@
 
1
  ---
2
- base_model: unsloth/qwen2.5-coder-14b-instruct-bnb-4bit
3
- tags:
4
- - text-generation-inference
5
- - transformers
6
- - unsloth
7
- - qwen2
8
- - trl
9
- - sft
10
  license: apache-2.0
 
 
11
  language:
12
  - en
 
 
 
 
 
 
 
13
  ---
14
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+
2
  ---
 
 
 
 
 
 
 
 
3
  license: apache-2.0
4
+ datasets:
5
+ - smirki/UI_REASONING_v1.01
6
  language:
7
  - en
8
+ base_model:
9
+ - Qwen/Qwen2.5-Coder-14B-Instruct
10
+ tags:
11
+ - code
12
+ - ui
13
+ - generation
14
+ - uigen
15
  ---
16
 
17
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/VSplF7AM1PJPzeR9FlDhE.png)
18
+
19
+ # **Model Card for UIGEN-T1.1**
20
+
21
+ New and Improved reasoning traces. Better ui generation. Smarter decisions. Better code generation! Trained on a 700+ dataset.
22
+ USE BUDGET FORCING (putting the word answer or think at the end of the assistant generation to keep generationg more thinking and use 'answer' to write code.)
23
+ SFT on a 4090 for 4 hours.
24
+
25
+ ## **Model Summary**
26
+ UIGEN-T1.1 is a **14-billion parameter transformer model** fine-tuned on **Qwen2.5-Coder-14B-Instruct**. It is designed for **reasoning-based UI generation**, leveraging a complex chain-of-thought approach to produce **robust HTML and CSS-based UI components**. Currently, it is limited to **basic applications such as dashboards, landing pages, and sign-up forms**.
27
+
28
+ ## **Model Details**
29
+
30
+ ### **Model Description**
31
+ UIGEN-T1.1 generates **HTML and CSS-based UI layouts** by reasoning through design principles. While it has a strong **chain-of-thought reasoning process**, it is currently **limited to text-based UI elements and simpler frontend applications**. The model **excels at dashboards, landing pages, and sign-up forms**, but **lacks advanced interactivity** (e.g., JavaScript-heavy functionalities).
32
+
33
+ - **Developed by:** [smirki](https://huggingface.co/smirki)
34
+ - **Shared by:** [smirki](https://huggingface.co/smirki)
35
+ - **Model type:** Transformer-based
36
+ - **Language(s) (NLP):** English
37
+ - **License:** Apache 2.0
38
+ - **Finetuned from model:** Qwen2.5-Coder-14B-Instruct
39
+
40
+ ### **Model Sources**
41
+ - **Repository:** (Will be uploaded to GitHub soon)
42
+ - **Hosted on:** [Hugging Face](https://huggingface.co/smirki)
43
+ - **Demo:** Coming soon
44
+
45
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/617YL3OlJHflvR63qbA27.png)
46
+
47
+
48
+ ## **Uses**
49
+
50
+ ### **Direct Use**
51
+ - Generates HTML and CSS code for **basic UI elements**
52
+ - Best suited for **dashboards, landing pages, and sign-up forms**
53
+ - Requires **manual post-processing** to refine UI outputs
54
+ - **May require using the word "answer" at the end of the input prompt** to get better inference
55
+
56
+ ### **Downstream Use (optional)**
57
+ - Can be fine-tuned further for **specific frontend frameworks (React, Vue, etc.)**
58
+ - May be integrated into **no-code/low-code UI generation tools**
59
+
60
+ ### **Out-of-Scope Use**
61
+ - Not suitable for **complex frontend applications** involving JavaScript-heavy interactions
62
+ - May not generate **fully production-ready** UI code
63
+ - **Limited design variety** – biased towards **basic frontend layouts**
64
+
65
+ ## **Bias, Risks, and Limitations**
66
+
67
+ ### **Biases**
68
+ - **Strong bias towards basic frontend design patterns** (may not generate creative or advanced UI layouts)
69
+ - **May produce repetitive designs** due to limited training scope
70
+
71
+ ### **Limitations**
72
+ - **Artifacting issues**: Some outputs may contain formatting artifacts
73
+ - **Limited generalization**: Performs best in **HTML + CSS UI generation**, but **not robust for complex app logic**
74
+ - **May require prompt engineering** (e.g., adding "answer" to input for better results)
75
+
76
+ ## **How to Get Started with the Model**
77
+
78
+ ### **Example Model Template**
79
+ ```plaintext
80
+ <|im_start|>user
81
+ {question}<|im_end|>
82
+ <|im_start|>assistant
83
+ <|im_start|>think
84
+ {reasoning}<|im_end|>
85
+ <|im_start|>answer
86
+ ```
87
+
88
+ ### **Basic Inference Code**
89
+ ```python
90
+ from transformers import AutoModelForCausalLM, AutoTokenizer
91
+
92
+ model_name = "smirki/UIGEN-T1.1-14B"
93
+ tokenizer = AutoTokenizer.from_pretrained(model_name)
94
+ model = AutoModelForCausalLM.from_pretrained(model_name).to("cuda")
95
+
96
+ prompt = """<|im_start|>user
97
+ Make a dark-themed dashboard for an oil rig.<|im_end|>
98
+ <|im_start|>assistant
99
+ <|im_start|>think
100
+ """
101
+
102
+ inputs = tokenizer(prompt, return_tensors="pt").to("cuda")
103
+ outputs = model.generate(**inputs, max_new_tokens=12012, do_sample=True, temperature=0.7) #max tokens has to be greater than 12k
104
+
105
+ print(tokenizer.decode(outputs[0], skip_special_tokens=True))
106
+ ```
107
+
108
+ ## **Training Details**
109
+
110
+ ### **Training Data**
111
+ - **Based on:** Qwen2.5-Coder-14B-Instruct
112
+ - **Fine-tuned on:** UI-related datasets with reasoning-based HTML/CSS examples
113
+
114
+ ### **Training Procedure**
115
+ - **Preprocessing:** Standard text-tokenization using Hugging Face transformers
116
+ - **Training Precision:** **bf16 mixed precision** quantized to q8
117
+
118
+ ## **Evaluation**
119
+
120
+ ### **Testing Data, Factors & Metrics**
121
+ - **Testing Data:** Internal UI design-related datasets
122
+ - **Evaluation Factors:** Bias towards basic UI components, robustness in reasoning, output quality
123
+ - **Metrics:** Subjective evaluation based on UI structure, correctness, and usability
124
+
125
+ ### **Results**
126
+ - **Strengths:**
127
+ - **Good at reasoning-based UI layouts**
128
+ - **Generates structured and valid HTML/CSS**
129
+ - **Weaknesses:**
130
+ - **Limited design diversity**
131
+ - **Artifacting in outputs**
132
+
133
+ ## **Technical Specifications**
134
+
135
+ ### **Model Architecture and Objective**
136
+ - **Architecture:** Transformer-based LLM fine-tuned for UI reasoning
137
+ - **Objective:** Generate **robust frontend UI layouts with chain-of-thought reasoning**
138
+
139
+ ### **Compute Infrastructure**
140
+ - **Hardware Requirements:** 12GB VRAM reccomended
141
+ - **Software Requirements:**
142
+ - Transformers library (Hugging Face)
143
+ - PyTorch
144
+
145
+ ## **Citation**
146
+ If using this model, please cite:
147
+
148
+ **BibTeX:**
149
+ ```bibtex
150
+ @misc{smirki_UIGEN-T1.1,
151
+ title={UIGEN-T1.1.1: Chain-of-Thought UI Generation Model},
152
+ author={smirki},
153
+ year={2025},
154
+ publisher={Hugging Face},
155
+ url={https://huggingface.co/smirki/UIGEN-T1.11}
156
+ }
157
+ ```
158
+
159
+ ## **More Information**
160
+ - **GitHub Repository:** (Coming soon)
161
+ - **Web Demo:** (Coming soon)
162
+
163
+ ## **Model Card Authors**
164
+ - **Author:** smirki
165
+
166
+ ## **Model Card Contact**
167
+ - **Contact:** [smirki on Hugging Face](https://huggingface.co/smirki)
168
+
169
+
170
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/VLs2LyOPXV4GZ2feXpD7F.png)
171
+
172
+
173
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/boAgm__7mbD_B37OZzzyw.png)
174
+
175
+
176
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/aBn-uzBsmK7vj-CxXRyBi.png)
177
+
178
+
179
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/HaPat6448BpqneaBU47bz.png)
180
+
181
+
182
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/8VuOPWMSJlu3kxmUQJb6R.png)
183
+
184
+
185
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/RgFpQigIYes7wvzulZnkg.png)
186
+
187
+
188
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/alBaCYJSLKyomF55XjOv-.png)
189
+
190
+
191
+ ![image/png](https://cdn-uploads.huggingface.co/production/uploads/64d1129297ca59bcf7458d07/k3uu2IPU_wIWco45RwdOV.png)
192
+
193
+ ---