A video platform for early childhood educators.
For Rutgers University, I led the creation of a video website for the professional development of early childhood educators, from first research through launch and two years of upkeep.
- Client
- Rutgers University
- Role
- Web development & design, freelance
- When
- Mar 2015 – Mar 2017
- Where
- New Brunswick, NJ
- Status
- No longer online
How it came together
I ran the project end to end. The steps are in the order the work happened.
Research
Talked with early childhood educators to learn what they needed from professional development videos and how they would use the site.
Planning
Wrote a project plan covering scope, timeline and resources.
UX/UI design
Designed a clear, easy-to-navigate interface, from wireframes to final screens.
Content
Produced and curated video content for educators' professional development.
Development
Built the site with modern web technologies, fully responsive across phones, tablets and desktops.
Testing
Tested thoroughly and fixed issues before launch.
Launch
Launched the site and made it available to educators.
Maintenance
Kept the site up to date and running after launch.
Information architecture
Before any design, I mapped the site. Educators reach content by role: coaches, teachers and administrators each get the same three paths to workshops, coaching and professional learning communities.
- Home
- Educators
- Coaches
- Teachers
- Administrators
Each role has- Workshops
- Water Module
- Workshop overview
- Sink & Float
- Play Matters
- Movement of Water
- Water Module
- Coaching
- PLCs (Professional Learning Communities)
- About Us
- Contact Us
What shipped
A video site educators could use on any device, and tools that let the client run it without me.
- Feature
Video library
Professional development videos produced and curated for early childhood educators.
- Feature
Fully responsive
Works well on phones, tablets and desktops.
- Feature
Admin panel
Administrators manage content and user access on their own.
- Ongoing
Maintenance
Updates and fixes after launch to keep the site current.
From wireframe to design
Three rounds of home page wireframes, then the design mockups. Select one to see the full page, then use the arrow keys to step through.
-
Home page, first pass
01 · Wireframe -
Home page with video rows
02 · Wireframe -
Home page with featured player
03 · Wireframe -
Home page, by subject
04 · Mockup -
Home page, by grade
05 · Mockup -
Home page, by program
06 · Mockup -
Educators: Workshops
07 · Mockup -
Video page with guide and notes
08 · Mockup