Sub1

Sub2

Hype as Keynote

Use this area as a virtual whiteboard for class discussion

Bullet Title 1. Item 1 2. Item 2 3. Item 3 4. Item 4 5. Item 5

Emphasis Title

This demonstrates animation and list-building. Yes, there’s a story here ;)

Title

2

This demonstrates interactivity and a virtual whiteboard

1

Dropbox.com

This scrolls via vertical drag

concept via Fabricio Teixeira, uxdesign.cc

“

4

Design matters

3

Ralph Speth, CEO, Jaguar

Just a classic slide layout

If you think good design is expensive, you should look at the cost of bad design.

hillmann-living.de

This demonstrates live data (a static copy is underneath for non-wifi environment)

1. Provide link, snapshot(s) of landing page 2. Give a brief listing of its “story” 3. Does this support the presumed product goals? 4. Be prepared to present in class

Classic slide layout

Assignment 1:  “Read” a web page or app

Step

Test

This demonstrates interactivity - click on a thumb. The class was handed identical cards

“Tab bars are always on the bottom"

This demonstrates build-ins and animation timing which are easier than Keynote

• Live web data • Interative widgets (only partially explored here) • Abiity to enter forms to avoid turning on the lights and going to a white board • Much more powerful animation • Hype UI is faster than Keynote for tweaking attributes • Compound styles (a font style, plus a size style for example) • List building outside of InnerHTML • Slide transitions • Inserting animation keyframes • Master slides were missed • Exposed “step” and “fullscreen” widgets

Author’s Note: These are some excised and redacted slides that I made as an experiment for a UX design course I’m teaching in Paris. The point of the experiment was to see if I could replace Keynote with Hype. I had 6 main interests: Where it was challenging:  Compromise: I consider the experiment a success. HUGE thanks to Mark Hunter for the Gallery work, and Kerguelen for the fullscreen toggle. Peter Warner, unpressedbutton.com