ARTIFICIAL INTELLIGENCE VOICE INTERFACE DESIGN VIRTUAL ASSISTANTS VOICE SYNTHESIS PHYSICAL DESIGN SVELTE (KIT)   NODE.JS LLMS GPT4 INTEGRATION DASHBOARD INTERFACES

Smart Mirror Prototype

>

Let's build a Smart Mirror!

I've always been interested in the cutting edge æsthetics of products. My Bachelor's thesis involved an idea for a futuristic smart HUD in automobiles driven by a huge love and interest for FUIs and other futuristic interpretations of human-computer interaction.

With Smart Mirrors being relatively straight-forward to build, why not make something completely original (not using existing smart mirror frameworks) and personalized to my specific needs?

Technologies used

>

Svelte(kit)
Chat GPT (Prompt Engineering & Design, User needs/case iteration, evaluation, interaction design & flows)
Figma
Shaper 3D (For 3-D renderings and chassis design)
Visual Studio Code
Three.js
Node.js & Express.js
VOSK voice transcription API
Mistral 7B LLM, Node-NLP
Various APIs (including News, Music, Financial, Transportation, and Spotify)
Web Scrapers
Webflow
an X-Acto Knife 🔪

PROTOTYPE FEATURES

>

Interactive Voice Interface Assistant "PAL-12K"
Modular UI for personalized data needs
Local Weather & Time
Stocks, Crypto, News
Bart & Muni Metro Station Departures
Medicine Dosage Reminders tied to phone widget
Time of Day & Year Custom Salutations
Cyberpunk text-transition animations
Brutalist visual æsthetic
AQI / Wildfire Trackers
Calendar / Event Tracker

WIP voice interface with PAL-12K responses.

PAL-12K assistant interaction states: Idling, Listening, Processing, Context Handoff (QR code rendering), and Error.

Early renderings of a consolidated chassis-mount for the mirror and display.

WIP Health Data View

WIP General dashboard view showing Time, Weather, Temperature, Spotify Playback, Medicine Dosage reminders, Calendar, News, Stock + Crypto, & local Metro Transit time modules.

Current prototype of the mirror, with spotify API integration & playback, calendar, news/stocks/crypto, and local metro transit data.

Early renderings of the overall UI. During Spotify playback the two far-left images had an animation sampling the colors of the played album, written in p5.js, however it was removed for being too taxing on the system.

App Architecture

Expanded UI showing health tracking and pre-planned destinations.

Thanks for stopping by! If you'd like to see my corporate projects, check out my Portfolio.