TimeDesigner helps school teams
rapidly create multiple scheduling scenarios
from various perspectives,
and plan ahead for future iterations.
OddBird helped Tegy
plan, design, develop, launch, and maintain
their school scheduling web app
using CSS Grid and custom property wizardry
on the front-end,
and well-tested Django/Python on the back-end.
Currently, the software is only available to schools in
OddBird provided a focused team
with a wide range oftalent.
Tegy came to OddBird
with a multi-year plan
and a vision for
a suite of web applications
to help educators
improve their students’ school experience
through organization design.
They needed project planning and guidance,
wireframes and itemized estimates
for investor pitches.
brand and user experience design,
front- and back-end development,
and ongoing maintenance
for their first web application,TimeDesigner.
As with most OddBird web projects,
we started with a planning phase
to delve deep into the needs
of the educators who would use TimeDesigner,
as well as Tegy’s vision
for their business.
Research & Concepting included creation of a
Project Goals document,
and User Profiles to understand
the actions different users
may want to take at different stages
in their journey through the app.
We created a Data Model
and glossary of terms,
with database requirements and relationships.
We designed Wireframes –
unbranded and interactive
sketches of TimeDesigner’s corefeatures.
Based on our research
we compiled a full list of
all the required features
to reach Tegy’s goals –
itemized, estimated, and prioritized
into several phases.
Tegy used the R&C deliverables
to pitch investors
and to raise funding
for an innovative school scheduling tool
They were successful,
we moved to the next phase,
I really enjoy this iterative design process.
Seeing how OddBird does the iteration
has improved my own iterative system withschools.
Before digging into
the juicy details
of Design & Development
a word about Project Management.
While Research & Concepting helped
with initial sorting,
and feature prioritization,
ongoing Project Management
was key to distilling Tegy’s broad vision
into a useful, digitalproduct.
At regular intervals
throughout design & development
of the TimeDesigner web application,
OddBird met with Furman
on video calls
and in person.
We spent time listening to the vision
and asking strategic questions –
getting to the heart of the project,
understanding the reason behind
each new feature suggestion,
and identifying top priorities.
When presented with proposals
for small features,
we asked how each would support
Tegy’s long-term goals.
When presented with big-picture vision,
we helped suggest specific,
that would move the project
in the desireddirection.
When clients present us with small feature ideas,
we keep asking why.
When presented with a big vision,
we keep askinghow.
—Miriam Suzanne, Co-founder atOddBird
we dug into the details
of new features
to determine the implications –
both for the application itself
and for usability.
Drawing on our many years of experience,
deep knowledge of web app development,
and involvement at the cutting edge of our fields,
OddBird guided Tegy
in a direction that would
have the biggest impact for users
without blowing theirbudget.
At the end of each planning conversation,
we documented proposed features
in the Trello project management tool.
and prioritized Trello cards
into two-week plans –
what are the most important features
right now –
and saved long-term feature goals
to be prioritizedlater.
For optimal flexibility,
an experience may overlap in time with another experience.
Thanks to CSS Grid,
we are able to place these in a sensible way with minimal effort.
Using grid-auto-flow with a value of dense,
we can allow the row to place experiences where they
fit, regardless of where they were added in the markup.
Additionally, we can assign the row a minimum height
and allow it to grow taller as needed using minmax.
This use of CSS Grid combined beautifully
with an intuitive drag-and-drop interface.
An experience’s --start variable is
updated continuously while being dragged,
allowing it to move responsively along thegrid.
Users needed the ability to view, print or download
PDF reports of their scenarios
using print-specific layouts.
To do this, we created
custom print styles,
and used print-to-pdf
in a headless Chrome instance
to render an HTML string to aPDF.
In addition to showing the scenario grid,
the reports included an expanded table view for each row
and a chart of the total minutes per color for thescenario.
Site-Wide Undo &Redo
We also implemented a site-wide undo/redo feature
(available via visible buttons
or familiar Ctrl-Z/Ctrl-Shift-Z/Ctrl-Y keyboard shortcuts)
through a custom action manager.
Each action taken on the site
is added to a stack,
storing both “forward” and “backward” effects.
Undoing an action
triggers the “backward” effect
of the most recent action,
popping it off the end of the stack.
Redoing an action runs the “forward” effect again,
adding the action back to the end of thestack.
In the years
since TimeDesigner launched,
OddBird has continued
to support the project.
We have provided periodic bug fixes
and maintenance –
though the site has needed relatively little.
Tegy has been training school teams
and scheduling engineers
in organization design using TimeDesigner.
After several years,
we are excited to work with Tegy again
to create Phase 2 of TimeDesigner,
enabling more schools
to innovate organization models,
make better use of their resources,
and improve the learning environment
A meditation on typography, Adobe Fonts’ Game allows players to choose the fonts that they feel apply best to different scenarios. Players’ input helps Adobe Fonts continue to improve on their new browse-by-tags feature. We worked closely with Adobe to create animated & interactive illustrations using GreenSock, NuxtJS, and CSS…
A custom application we designed and built in collaboration with Quarq’s internal developers – including a responsive interface, real-time mapping & telemetry, social networking, and third-party integrations with Strava, Training Peaks, Dropbox, and Today’s Plan.
A custom application we designed and developed with the ORCAS team – integrating their suite of self-management tools. We built in support for video chat, in-app messaging, public Q&A, webinars, file sharing, health assessments, and more. The app has been used internally by the US Coast Guard, US Military…