Turning Research Into Concepts

November 16th, 2011 by projectinteraction | Filed under Discovery, Teaching.

From our third teacher, Abby Covert:

In our third class, we started by discussing what makes up a website: Content and Structure. As a group we discovered we needed to decide the content (at least broadly) in order to get to the structure, and I introduced the tools of sitemaps and wireframes to the girls.

For our first exercise, the girls – armed with their research – started by brainstorming the types of content and features they could see on the website. We took turns sharing our ideas and each girl would cluster her ideas near those similar that had been already shared.

We started to see big buckets emerging quickly around:

  • A section to introduce the program
  • Staff bios and pictures
  • Class schedule and Descriptions, photos, videos
  • Contact Us page
  • A logged in area for students, teachers and maybe parents
  • An area to talk to potential donors

Most surprising was how well the girls knew the language of the web already, having deep but quick conversations about specifics like including a “privacy policy” and perhaps having an “intro animation.” And of course “Forgot Password.”

Creating Form from Structure

After a quick tutorial on sketching interfaces for websites each student chose 3 ideas to draw out and share back to the group. Anxious to get markers in their hands to see what came out, I was excited to see that their ideas were well formed, detailed and thoughtful.

Next we all drew what we thought a home page might look like. They talked about what ideas they liked and didn’t like from each representation. Then someone asked:

“How do we decide what the top sections are, cause ours are all different.”

I knew they were ready to make a sitemap. Armed with all our pictures and post-its filled with content and feature ideas we started to sort them into buckets and fill out our first draft of a sitemap.

When we finished assembling our map, one girl asked:

“What about colors and the logo – we all came up with those too so why isn’t that on the sitemap?”

What a great opportunity to talk about the difference between content and form! They quickly grasped this concept and all agreed the visual design must wait until we are sure of the content.

Our class ended with the girls getting excited for the challenges that lie ahead, but nervous about making everything really happen. Turns out even teens get stressed during discovery. ;)

More to come… one week at a time!

Tagged with: , , ,

Leave a Reply