Ruff Ruffman: Humble Media Genius

Ruff Ruffman: Humble Media Genius is a digital web series and website that teaches kids about digital media literacy. I designed the responsive website.

Homepage 
This project incorporates an old character in to a new brand. We wanted the site to feel modern to appeal to a new, slightly old audience. 
 
Responsive Site
I pushed for the design to feel more like a stream-lined app than a traditional website. 
Sitemap
I played a lead role in designing the site architecture. Rather than bundling the content in traditional content bundles (video index, article index) we chose to organize the content by topic. 
This site map reflects the first season of the site, as well as season 2 addiitions (in red).
Styleguide
Spec delivery for developer. The initial branding, palette, type choice and logo, was done by my art director. I created a web system from his initial work.
Topic Patterns
I created a system of patterns based on the texting pattern that was created by my art director. The patterns were used on the video title cards and on the site topic indexes. 
Topic Index - Comp
The index is a mix of thumbnails with an interactive poll. Content is highlighted by priority. 
Quiz - Comp
Each topic has a 10 question quiz. I designed the quiz and chose or created image for all 40 questions. 
Video Player - Comp
The video page, and all third-level pages, are meant to feel like modal box or overlay. The pages are very simple, with minimal navigation.

More Projects

Design Squad Redesign
Nature Changer
First Days Story Project for American Experience
Ruff Ruffman - Ready to Learn
The Ruff Ruffman Show Website
Can You Dig It - Endless Runner Bilby Game
Outdoor Family Fun with Plum App
Plum's Photo Hunt App