swiss_design_lineage_vibecoding

Grading Rubric & Submission

How Your Project Will Be Evaluated

Total: 100 points

📊 Grading Breakdown

1. Design Quality (35 points)

Style Authenticity (15 pts)

✅ Matches chosen style’s visual characteristics
✅ Uses style-appropriate typography
✅ Implements correct color palette
✅ Captures the style’s “vibe” and philosophy
❌ Generic/modern design that doesn’t reflect style

Visual Execution (10 pts)

✅ Professional appearance
✅ Consistent throughout all pages
✅ Proper hierarchy and spacing
✅ Polished details
❌ Sloppy, inconsistent, or unfinished look

Content Design (10 pts)

✅ Meaningful content about the style
✅ Effective use of images/references
✅ Clear information hierarchy
✅ Engaging presentation
❌ Lorem ipsum, minimal content, or poor presentation

2. Technical Quality (25 points)

Responsive Design (10 pts)

✅ Works on desktop (1920px)
✅ Works on tablet (768px)
✅ Works on mobile (375px)
✅ No horizontal scrolling
✅ Content readable at all sizes
❌ Broken layouts, overlapping elements

Performance (8 pts)

✅ Lighthouse Performance 90+
✅ Lighthouse Accessibility 90+
✅ Lighthouse Best Practices 90+
✅ Lighthouse SEO 90+
❌ Any score below 80

Code Quality (7 pts)

✅ Clean, organized HTML/CSS
✅ Proper semantic HTML
✅ No console errors
✅ Accessibility features (alt text, ARIA labels)
❌ Messy code, errors, accessibility issues

3. AI Collaboration (25 points)

Strategic Direction (10 pts)

✅ Clear, specific prompts
✅ Evidence of iteration and refinement
✅ Good use of references/examples
✅ Thoughtful decision-making
❌ Vague requests, accepted first result, no iteration

Process Documentation (10 pts)

✅ Screenshots showing progression
✅ Notes on decisions made
✅ Evidence of research phase
✅ Documented challenges and solutions
❌ Missing process, no documentation

AI Tool Usage (5 pts)

✅ Effective use of GitHub Copilot
✅ Appropriate task breakdown
✅ Good debugging approach
❌ Poor prompting, inefficient workflow

4. Collaboration Story (15 points)

Reflection Quality (8 pts)

✅ AI-generated reflection on partnership
✅ Thoughtful analysis of collaboration
✅ Specific examples and insights
✅ Well-written and engaging
❌ Generic, shallow, or missing

Process Narrative (7 pts)

✅ Clear description of workflow
✅ Challenges and how they were overcome
✅ Evolution of the design
✅ Key decisions explained
❌ Vague timeline, missing key moments

🎯 Grade Ranges

A (90-100 points)

Authentic style implementation
Professional execution
All technical requirements met
Strong AI collaboration
Excellent documentation

B (80-89 points)

Good style implementation with minor issues
Solid technical quality
Most requirements met
Good AI collaboration
Complete documentation

C (70-79 points)

Recognizable style but inconsistent
Some technical issues
Basic requirements met
Basic AI collaboration
Minimal documentation

D (60-69 points)

Style poorly implemented
Significant technical issues
Missing requirements
Weak collaboration evidence

F (<60 points)

Does not match style
Broken functionality
Missing major requirements
No collaboration documentation

📦 Submission Requirements

What to Submit

1. Live Website URL

Deployed to GitHub Pages, Netlify, or similar
Fully functional
All pages accessible

2. GitHub Repository Link

Public repository
All code committed
Meaningful commit messages
README.md updated

3. Documentation (in your repo)

/research/ folder with references
/docs/ folder with process notes
Collaboration story page
Updated README with:
- Style chosen
- Time spent
- Key decisions made
- Challenges overcome

File Structure Expected

your-project/
├── index.html
├── about.html
├── [other pages].html
├── css/
│   └── style.css
├── images/
│   └── [your images]
├── research/
│   ├── references/
│   │   └── [reference images]
│   └── references.md
├── docs/
│   └── process-notes.md
└── README.md

✅ Submission Checklist

Before submitting, verify:

Design

Matches chosen style authentically
All pages have meaningful content
Typography is style-appropriate
Color palette from style guide
Professional, polished appearance

Technical

Documentation

Research folder with references
Process notes in docs/
Collaboration story page
README updated with project info
Meaningful git commit history

Submission

Live URL submitted
GitHub repository link submitted
Repository is public
All files pushed to GitHub

🚨 Common Mistakes to Avoid

❌ Style mismatches

Choosing one style but implementing another
Generic modern design instead of authentic style
Missing key style characteristics

❌ Technical issues

Not testing on mobile devices
Ignoring Lighthouse warnings
Broken responsive layouts

❌ Missing documentation

No process screenshots
No research evidence
Minimal or missing collaboration story

❌ Last-minute submissions

Not enough time to fix issues
Deployed broken version
Missing pages or features

📅 Timeline

Recommended submission schedule:

Days 1-2: Research & planning

Choose style
Gather references
Plan content

Days 3-5: Building

Sprint 1: Foundation
Sprint 2: Components
Sprint 3: Polish

Day 6: Quality assurance

Test all devices
Run Lighthouse
Fix any issues

Day 7: Documentation & submission

Write collaboration story
Update README
Deploy
Submit

💡 Tips for Success

Start with strongest pages

Homepage must be excellent
One content page should be complete
About page shows understanding

Iterate until excellent

Don’t accept “good enough” too early
2-3 iterations minimum per section
Compare constantly to references

Test early and often

Check mobile after each section
Run Lighthouse multiple times
Fix issues immediately

Document as you go

Take screenshots during build
Note decisions in real-time
Don’t wait until end

Use time wisely

Focus on quality over quantity
3 excellent pages > 10 mediocre pages
Stop reading, start building

🤔 Questions?

“Do all pages need to be perfect?” No. Focus on homepage + one content page being excellent. Others can be good.

“What if my Lighthouse score is 89?” That’s fine. We’re looking for 90+ but 85-89 is acceptable if design is strong.

“How much documentation is enough?” Enough to show your process. 5-10 screenshots, a few notes, collaboration story page.

“Can I change my style mid-project?” Only within first 2 days. After that, stick with your choice and iterate.

“What if I run out of time?” Submit what you have. Partial credit for incomplete work if quality is there.

📤 How to Submit

On Canvas (or your LMS):

Submit live website URL
Submit GitHub repository link
Add any notes for instructor

Double-check before submitting:

URLs are public and accessible
Repository is public
All pages load without errors

Questions about grading?
Contact instructor before submission deadline.

Project: Swiss Design Lineage Vibe Coding
Version: 3.0 — November 2025