IntelliCourse
AI-powered learning platform that generates courses, adapts to learners, and provides instant assessments.
Overview
I lead front‑end implementation and interaction design. My focus: scalable UI architecture, design system, and performant motion.
My Role & Contributions
Front‑end Architecture
Built App Router structure, routing, layouts, and shared providers.
Component Library
Created reusable UI components and patterns with Tailwind.
Design System
Tokens, spacing scale, typography, and accessible color usage.
Form Flows
Built multi‑step forms with validation, errors, and progressive disclosure.
Motion & Interactions
Micro‑interactions with Framer Motion; reduced motion fallbacks.
Quality & Hardening
Edge cases, loading/skeleton states, and resilient UI under failure.
Architecture & Stack
Goals & Constraints
Performance & Accessibility
- Keyboard navigable components and visible focus states
- Semantic landmarks and headings hierarchy
- Reduced motion fallback and lazy-loaded heavy media
- Optimized images with Next/Image and responsive sizes
Implementation
AI-Powered Learning, Reimagined
IntelliCourse offer accessible learning for everyone using AI technology. A diverse range of AI-generated courses for learners of all levels, providing interactive learning experiences and real-world applications. Gain skills and test your learning progress with course assignments, IntelliCourse would take care of the rest! Providing grades and feedbacks even on your presentation video assignment!
Our current team includes two designers and four software developers, working collaboratively to bring innovative solutions to life.
As the front-end developer and Interactive Designer for our startup, I play a crucial role in bringing our product to life through code and design. My responsibilities span across various aspects of our product development process.
Core Responsibilities
- Develop and maintain front-end architecture
- Implement user interface designs
- Create interactive designs
- Ensure responsive and cross-browser compatibility
Specialized Focus
- User interface components
- Interactive prototypes
- Implementation of design systems
- Performance optimization
In our small team, I work closely with our product designers and back-end developers to ensure a seamless integration of design and functionality. My focus on interactive design helps create engaging user experiences that set our product apart in the market.
Technical Implementation Highlights
Component-driven system
Composable components with clear props, slot patterns, and variant-driven styles.
App Router & RSC boundaries
Layout composition with server components by default; client islands where interaction is required.
Form architecture
Multi-step flows with field-level validation, error surfaces, and controlled inputs.
Build smarter courses
that learners love
Challenges & Solutions
Complex multi‑step forms
Modular steps with state isolation, optimistic UI, and inline validation.
Motion without jank
Framer Motion variants + prefers‑reduced‑motion and intersection observers.
Consistent theming
Central tokens and utilities; constrained component APIs and docs.
What I’d improve next
- Refine analytics dashboards for instructors.
- Deeper accessibility audits and keyboard testing.
- Server-side render critical pages for faster TTFB.