App Design

Interactive prototypes and web applications

SonicVault

Audiophile Music App

A modern, mobile-first music player prototype featuring an intuitive interface with album browsing, favorites system, and a powerful 10-band equalizer. Designed to showcase interaction design and front-end development skills with a focus on user experience and audio control.

JavaScript Web Audio API Responsive Design
View Live Demo →
Audiophile Music Player
ENTER
Now Playing
Quiet Nights Album Cover
Where Or When
Diana Krall - Quiet Nights
FLAC 24-bit/192kHz
0:00 4:09
⏮
▶
⏭
DSD
Hi-Res
Lossless
24-bit
Equalizer
Equalizer
Flat
Rock
Jazz
Classical
Bass
60Hz 170Hz 310Hz 600Hz 1kHz 3kHz 6kHz 12kHz 14kHz 16kHz
HOME
PLAYING
FAVS

DesignPath

Design Thinking Course App

A comprehensive 14-week design thinking course application featuring interactive modules, collaborative group work, weekly assignments, and rich multimedia resources. Built to guide students through the complete design thinking process from empathy to testing.

JavaScript Tailwind CSS Interactive Learning
View Live Demo →
14-Week Journey
14
40+
5
👤 Work Solo
👥 Join Group
Design Thinking
5 Phases • 14 Weeks
Empathize
Weeks 1-3
Define
Weeks 4-5
Ideate
Weeks 6-8
Prototype
Weeks 9-11
Test
Weeks 12-14
Week 1
Introduction
📚 Learning
Understanding empathy in design thinking and user research
✏️ Assignment
Conduct user interviews
Due: End of Week
🎯 Resources
• Video: Empathy Maps
• Article: User Research
• Template: Interview
═══════════════════════════════════════════════════════════════ -->
Build real AI skillsfor digital media

AIPath

AI in Digital Media Course App

A comprehensive 16-week course application for learning AI tools across text, image, audio, video, and web production. Features a bilingual EN/ES interface, AI Process Journal with formative checkpoints, 40+ curated tools per module, and an authorship declaration system built on process-over-output pedagogy.

JavaScript Space Grotesk Bilingual EN/ES
View Live Demo →
Build real AI skillsfor digital media
16
WKS
6
MOD
40+
TOOLS
👤 Work Solo
👥 Join / Create Group
EN
ES
AI in Digital Media
M1 — Text Generation
Weeks 1–5
M2 — Image Generation
Weeks 6–8
M3 — Audio Generation
Weeks 9–10
M4 — Video Generation
Weeks 11–12
M5 — Website Gen.
Week 13
M6 — Deepfakes & Trends
Weeks 14–16
Progress0%
📓 AI Process Journal
Week 1 — Intro to AI
📝 Prompts
🔄 Result
🧠 Eval
🏷️
Tools used
ChatGPT Claude Gemini
Your prompt
"Compare how ChatGPT, Claude, and Gemini handle the same creative brief..."
🎯 WHY — REQUIRED
Cannot proceed without explaining why you chose this result. Your reasoning proves authorship.