For diagrams, visual examples and the full layout, open the handout above.
BUILD FROM YOUR BRIEF
GRADE 8 DESIGN • PERSONAL WEBSITE • VERSION 1
You already have a website. Today make it match the PURPOSE and USER you chose — while AI acts as your developer.
YOU = DESIGNER / PROJECT MANAGER • AI = WEB DEVELOPER
Don't ask AI what your website should be. Tell it what you decided it should be.
| 1 | PULL FROM YOUR PROJECT BRIEF |
| MY PRIMARY USER
________________________________________________________________________ |
| MY 3 IDENTITY WORDS
________________________________________________________________________ |
| MOST IMPORTANT CONTENT
________________________________________________________________________ |
| PURPOSE OF MY WEBSITE
________________________________________________________________________ |
| Look at your CURRENT website. What does not match your brief yet?
________________________________________________________________________
________________________________________________________________________ |
| 2 | TODAY'S DEVELOPMENT LIST |
| MUST FIX | Something already there that is wrong or weak.________________________________________ |
| MUST ADD | Something your brief requires but is missing.________________________________________ |
| WANT TO TRY | Something ambitious or interesting.________________________________________ |
| Give AI your existing code, then say:You are my web developer. I am the designer/project manager.My brief:• Purpose: ...• Primary user: ...• Three identity words: ...• Most important content: ...Today:• FIX: ...• ADD: ...• EXPERIMENT: ...Do not invent a new concept. Preserve the parts that already support my brief.
________________________________________________________________________ |
| 4 | BUILD → TEST → CRITIQUE → REVISE |
You may NOT accept AI's first result automatically.
| What was weak about AI's first version?
________________________________________________________________________
________________________________________________________________________ |
| What specific revision did you request?
________________________________________________________________________
________________________________________________________________________ |
| 5 | BUILD YOUR 'WANT TO TRY' FEATURE |
| □ Interactive timeline | □ Project gallery | □ Quiz about me |
| □ Draggable desktop | □ Retro interface | □ Virtual bookshelf |
| □ Project filter | □ Image carousel | □ Clickable map |
| □ Achievements | □ Easter egg | □ Theme selector |
| □ Fake OS | □ Skill tree | □ Other |
| My feature should let the visitor…
________________________________________________________________________
________________________________________________________________________ |
| 6 | PARTNER TEST — DON'T EXPLAIN IT |
| What did you think you could click?
________________________________________________________________________ |
| What did you expect would happen?
________________________________________________________________________ |
| Did it work?
________________________________________________________________________ |
| Did it improve the site — or just make it more complicated?
________________________________________________________________________ |
Design is also REMOVING.
| □ effect | □ repeated text | □ pointless button |
| □ ugly AI addition | □ meaningless image | □ unnecessary section |
| I deleted __________________ because…
________________________________________________________________________
________________________________________________________________________ |
| 8 | SAVE PERSONAL WEBSITE — VERSION 1 |
□ FIX completed
□ ADD completed
□ TRY built
□ Revised AI output
□ Partner tested it
□ Deleted one thing
| Biggest change today — and how it supports my brief:
________________________________________________________________________
________________________________________________________________________ |
| Next thing I want AI to BUILD / FIX:
________________________________________________________________________
________________________________________________________________________ |
NEXT: MAKE THE WHOLE SITE FEEL LIKE ONE PRODUCT
Consistency • navigation • hierarchy • removing accumulated AI junk