Highlights
- Designed and built a project-management web application in HTML, CSS, and JavaScript with no framework dependencies.
- Dashboard with live KPIs (active projects, due this week, overdue, completion rate), an upcoming-deadlines feed, and per-project progress bars.
- Bidirectional calendar-to-project linking: tasks appear on a month-view calendar color-coded by project, and completed items are struck through automatically.
- Project pages with tasks, subtasks, due dates, completion tracking, and attached links and images.
- Deployed on GitHub Pages; used daily to manage coursework, applications, and personal projects.
Overview
Loom is a project-management application I designed and developed to track coursework, job applications, and personal projects in one place. It is built in HTML, CSS, and JavaScript without external frameworks and deployed on GitHub Pages. I use it daily.
Features
| Dashboard | KPI cards for active projects, tasks due this week, overdue items, and overall completion rate |
|---|---|
| Up next | Chronological feed of upcoming deadlines tagged by project |
| Progress tracking | Per-project progress bars with completed / total task counts |
| Calendar | Month-view grid of every due date, color-coded by project; completed tasks struck through |
| Projects | Tasks with subtasks, due dates, edit/delete, and attached links and images |
| Navigation | Sidebar (Home, Calendar, Projects, Tasks, Analytics, Settings) plus top navigation |
| Accounts | User sign-in |
Bidirectional calendar-to-project linking
Every task with a due date appears on the calendar in its project's color, and each calendar entry links back to its project. Completing a task in a project updates the calendar, the dashboard KPIs, and the project's progress bar together, so all three views stay consistent from a single data model.
Project view
Each project page shows overall progress, its task list with nested subtasks and due dates, and side panels for related links and images.
Interface design
The interface uses a navy-and-indigo palette, serif typography, and a color-coded category system that carries through the dashboard, calendar, and project pages, so each project is recognizable at a glance.
Skills applied
- Designing a shared data model that keeps multiple views (dashboard, calendar, projects) in sync.
- Building interactive UI components in plain JavaScript.
- UI/UX design: information hierarchy, color systems, and navigation.
- Static deployment with GitHub Pages.