Prototype Process

March 4

I started sketching and wireframing today. I decided to split up my content into pretty conventional categories based on my essay: About, OHno, Custom, Teaching, and Credits.

I chose to do a kiosk, since I thought it would be easier to code a desktop or mobile site due to the ease of access to those actual screens so I wanted to prototype something I wouldn’t have as easy access to.

I want to keep it all black and white to match my poster. And I wanted to feature large display type, because that’s what he’s most well-known for, so I made the title of each page really large and stuck the content into five columns underneath that. Pages like Notable, Font Name, and OHno Radio would all be subpages of the page from the top row that they’re directly underneath.

With Category, Font Name, and Piece, those are simply templates or placeholders. There will be multiple Category pages for different types of fonts, for example, and the name won’t be “Category” but something like “Display Fonts.”

With the Font Name page, in a finished, non-prototype example, users will be able to type their own words which will replace “Font Name.” They’ll also be able to control the size, weight, and other factors according to the variable font axes that Edmondson has designed.

March 16

After coming back from spring break and reworking my booklet, I decided to revisit my prototype design as well. I’m essentially translating my booklet into a digital, interactive version.

I’ve recreated all my spreads as pages and then modified them to translate to screens better—changing some layouts, making space for menus, etc.

I sort of have two menus: one that does categories of content and one that toggles back and forth between the type design process and Edmondson’s own personal journey.

March 29

After talking to Andrew, I’m adding some more motion and transition effects to the prototype. I can’t do everything I want it to do through Figma, but I can do enough to give the general concept. It’s just a prototype, after all.

Here’s what I ended up with!