Course එකට ආපසු

Design Iteration Challenge

30 මිනිත්තු🏋️Activity

Design Iteration Challenge

Skills push කරන time එක! One-Prompt Website එක ගෙන deliberate iteration හරහා good ඉඳන් great ට transform කරන්න.

🎯 පාඩමේ අරමුණු

මේ පාඩම ඉවර වෙද්දී ඔයාට:

  • Project එකට significant improvements තුනක් කරන්න පුළුවන් වෙයි
  • More advanced iteration techniques practice කරන්න පුළුවන් වෙයි
  • AI create කරන්න පුළුවන් දේ boundaries push කරන්න පුළුවන් වෙයි
  • Good design සඳහා ඔයාගේ eye develop කරන්න පුළුවන් වෙයි

Challenge එක

🏆 ඔයාගේ Mission

One-Prompt Website ගෙන AI prompts only use කරලා significant improvements තුනක් කරන්න.

Goal: ඔයාගේ good project එක GREAT project එකක් බවට transform!

"Significant" ලෙස Count වෙන්නේ මොනවද?

✅ Significant (count වෙනවා)❌ Minor (count වෙන්නේ නැහැ)
Whole new section add කිරීමWord එකක් change කිරීම
Color scheme completely change කිරීමමොකක් හරි slightly bigger කිරීම
Complex interactivity add කිරීමColor එකක් adjust කිරීම
Layout redesign කිරීමTypo fix කිරීම
Animations add කිරීමMinor spacing tweak

Category එකෙන් Iteration Ideas

Category 1: Visual Enhancements

ImprovementExample Prompt
Add shadows"Depth එකට cards හැමතනටම subtle box shadows add කරන්න"
Add gradients"Solid colors elegant gradients එක්ක replace කරන්න"
Add animations"Page load වෙනකොට smooth fade-in animation add කරන්න"
Add patterns"Background එකට subtle geometric pattern add කරන්න"
Add icons"Each section heading එක ලඟ relevant icons add කරන්න"
Dark mode"Toggle switch එක්ක dark mode version create කරන්න"

Category 2: Content Additions

ImprovementExample Prompt
New section"Quotes 3ක් එක්ක testimonials section add කරන්න"
FAQ section"Main content පහළ FAQ accordion add කරන්න"
Stats section"Numbers එක්ක key statistics පෙන්වන section add කරන්න"
Team section"Photos සහ names එක්ක team members grid add කරන්න"
Timeline"මගේ journey/history පෙන්වන timeline add කරන්න"

Category 3: Interactive Elements

ImprovementExample Prompt
Hover effects"Clickable elements හැමතනටම engaging hover effects add කරන්න"
Form"Email validation එක්ක newsletter signup form add කරන්න"
Modal popup"Learn More button click කරනකොට details එක්ක modal open වෙන්න"
Accordion"FAQ section smooth animation එක්ක collapsible කරන්න"
Scroll effects"Nav links click කරනකොට smooth scroll-to-section add කරන්න"

Category 4: Layout Changes

ImprovementExample Prompt
Two-column"Desktop එකට two-column layout එකට reorganize කරන්න"
Grid layout"Projects 3-column responsive grid එකේ display කරන්න"
Hero redesign"Hero section full-screen with centered content කරන්න"
Sticky header"Scroll කරනකොට navigation bar sticky කරන්න"
Card layout"List items beautiful card components වලට convert කරන්න"

Category 5: Polish & Professionalism

ImprovementExample Prompt
Typography"Better font pairing සහ hierarchy එක්ක typography improve කරන්න"
Whitespace"Breathing room එකට more strategic whitespace add කරන්න"
Consistency"Buttons, cards, spacing හැමඑකම consistent කරන්න"
Mobile optimization"Every section perfect mobile display එකට optimize කරන්න"
Loading states"Images වලට skeleton loading states add කරන්න"

ඔයාගේ Improvements තුන Document කරන්න

Improvement #1

📝

Reflection Journal

Saved privately on your device
0 characters
0 total characters

Improvement #2

📝

Reflection Journal

Saved privately on your device
0 characters
0 total characters

Improvement #3

📝

Reflection Journal

Saved privately on your device
0 characters
0 total characters

Challenge Levels

Level 1: Basic

Simple improvements 3ක් choose කරන්න:

  • Color scheme change කරන්න
  • Hover effects add කරන්න
  • Spacing improve කරන්න

Level 2: Intermediate

Moderate improvements 3ක් choose කරන්න:

  • New content section add කරන්න
  • Validation එක්ක form add කරන්න
  • Dark mode toggle implement කරන්න

Level 3: Advanced

Complex improvements 3ක් choose කරන්න:

  • Multiple animations add කරන්න
  • Tabbed interface create කරන්න
  • Scroll-triggered effects add කරන්න

Challenge Yourself!

At least Level 2 improvements try කරන්න. Boundaries push කරන්න!

Iteration Best Practices

✅ මෙහෙම කරන්න
❌ මේවා Avoid කරන්න
Prompts වල specific වෙන්න
'make it better' වගේ vague requests
Time එකට major change එකක් ask කරන්න
එකවිට changes 10ක් ask කිරීම
Each change එකට පස්සේ carefully review කරන්න
Review නොකර rushing
Work කරන දේ මත build කරන්න
Unnecessarily start over කිරීම
Like කරන versions save කරන්න
Good progress lose කිරීම
Mobile responsiveness check කරන්න
Mobile view ignore කිරීම

Before & After

ඔයාගේ transformation document කරන්න!

Screenshots ගන්න:

  1. Before: Improvements ට කලින් page screenshot
  2. Progress: Each improvement ට පස්සේ screenshot
  3. After: Final improved version screenshot

Document කරන්නේ ඇයි?

  • කොච්චර දුරක් ආවද බලන්න
  • Work කළ දේ මතක තියාගන්න
  • Journey share කරන්න
  • Process එකෙන් learn කරන්න

Bonus Challenges

Early finish කළොත් මේවා try කරන්න:

Bonus 1: Complete Redesign

Same content එක්ක completely different visual style එකෙන් fresh start කරන්න.

Try this prompt
Same content keep කරලා minimalist/bold/playful/corporate style එකෙන් page redesign කරන්න
ChatGPTClaude

Bonus 2: Multiple Themes

Themes switch කරන ability create කරන්න.

Try this prompt
Light mode, dark mode, high contrast mode switch කරන buttons add කරන්න
ChatGPTClaude

Bonus 3: Micro-interactions

Delightful small animations add කරන්න.

Try this prompt
Subtle micro-interactions add කරන්න: hover එකේ buttons scale වෙන්න ඕන, cards lift වෙන්න ඕන, icons pulse වෙන්න ඕන
ChatGPTClaude

Completion Checklist

✅ මේ lesson finish කරන්න කලින්:

0/6

Self-Assessment

ඔයාගේ improved project rate කරන්න:

📝

Reflection Journal

Saved privately on your device
0 characters
0 total characters

✅ පාඩමේ සාරාංශය

Practice කළ දේ:

  • Advanced iteration techniques
  • Specific, targeted prompts
  • Design critical evaluation
  • Progressive enhancement

Key Insight

Great designs prompt එකකින් හැදෙන්නේ නැහැ — ඒවා iteration හරහා refine වෙනවා.

Create → Review → Gaps Identify → Improve → Repeat

➡️ Next Lesson

සැමදාම smoothly යන්නේ නැහැ. Next, Troubleshooting Common Issues cover කරනවා, problems වලට prepared වෙන්න!