Span
Productivity & planning
Make the plan easier to see.
A lightweight Gantt planner for organizing work, seeing dependencies, and understanding how a schedule fits together.
Organize
Give projects, phases, and tasks a home.
Schedule
See the work together on a timeline.
Connect
Explore how dependencies shape the plan.
- My role
- Independent product design & prototyping
- Built for
- People planning projects, phases, and tasks
- Tools
- HTML · CSS · JavaScript · Local persistence
The problem
behind the product.
A schedule becomes harder to understand when its structure and relationships are buried. A useful planning tool needs to show the work clearly while keeping everyday changes simple.
The approach
Keep a work list and timeline together. Organize projects, phases, tasks, and milestones; change the zoom or rollup to suit the question; and reveal dependencies when the relationships matter.
A few decisions
that shaped it.
01Keep the list and timeline connected
Show ownership, status, and progress beside the schedule. Selecting work brings up its details, and dragging bars supports direct rescheduling.
02Reveal detail when it helps
Provide multiple timeline zoom levels, project and phase rollups, and optional dependency layers instead of displaying every detail at once.
03Iterate on the interaction
Explore how dependency traces communicate the path into a selected task. Small changes to motion, speed, and emphasis are part of making the relationship easier to read.
From idea to interface.
Real product screens. Select an image for a closer look.
AI helps me move.
Judgment sets the direction.
I use AI to prototype interface ideas quickly, then refine them through concrete interactions. Span is an example of that loop: describe the behavior, try it, identify what feels confusing, and revise the product details.
Where it is.
Where it goes next.
Span is an interactive HTML prototype with a work hierarchy, editable timelines, dependency controls, local saving, and plan export. The screens here use illustrative planning data. It is not presented as a deployed collaboration platform.
What’s next
Continue testing scheduling and dependency behavior, improve keyboard and smaller-screen interactions, and decide which features are worth taking beyond the prototype.
OpenCourt
Start a conversation
Good work starts
with a good question.
I’m interested in teams and people turning real problems into useful products. If that’s the work you’re doing, I’d like to hear about it.