Planning a Web Animation Course: An Interview with Jake Ströh

You might recognize Jake Ströh’s name from the video course “Up and Running with Hype“, a comprehensive video tutorial series demonstrating Tumult Hype’s features for beginners and intermediate users. Jake teaches many types of interactive courses at the University of Wisconsin – Milwaukee ranging from web design/prototyping to motion graphics. He also somehow finds time to operate Lake Effect Multimedia, a design and development company for regional and national clients.

Jake recently shared with us a few of his students’ projects at UWM in a great video:

If you’re curious how Tumult Hype fits into a motion graphics or web design course, read on for a quick Q&A with Jake:

Why did you choose to teach Tumult Hype in particular for the course?

Hype was an easy choice for a whole host of reasons. In particular, the efficient user interface is simple, yet powerful, workflows for creating motion based – interactive graphic experiences allowed my students to begin developing their ideas for projects sooner, rather than spending an entire semester learning a piece of software. Hype is effective at supporting and enhancing the vision of a creative rather than dictating how to create within a piece of software.

Also, the Hype Reflect mobile app is an effortless companion to the development workflow, which is key, because my design students are extremely eager to prototype their ideas for mobile. Lastly, the cost of the software is reasonable. While we had a handful of licenses on lab machines, it’s an easy request to ask students to purchase a license of Hype for less than the cost of many text books.

What kind of prior knowledge do you think students need before getting going with Tumult Hype, or web animation in particular?

Beyond the foundational understanding of how to create graphics and the various “allowed” graphic types that work for web based projects, there is no prior knowledge required to begin working with web animation in Hype or any other web animation based software. With that being said; Students with a foundational level of experience with HTML and CSS (JavaScript was an added bonus), had a better understanding of why limitation and benefit parameters existed when developing within an HTML5, CSS3 authoring environment.

How did you structure the course?

The course focus revolves around developing solid prototyping skills for mobile user experiences. We began by nurturing the creative process through the creation of low fidelity prototypes. Utilizing paper, printed out iOS interface elements and cardboard, students explored their ideas for creating mobile apps. Students worked in smaller focus groups where each person had a specified role for challenging the user experience and basic interface features of one of their peers. Once this process was completed, they would take their feedback to the next iteration of low-fidelity prototypes and present their prototypes once again. Finally after two rounds of usability and interface feedback, they would begin implementing their high-fidelity prototypes within Hype and then subject those to the same focus group style of usability feedback. Based on the initial feedback of the high-fidelity prototypes, they could make any final modifications before submitting their final solution.

Thanks for sharing the video of projects your students worked on. Can you describe them?

Project 1 focused less on interactivity and more on the responsive nature of design for mobile. Their designs has to look good in both landscape and portrait orientations. Hype’s “Pinning & Scaling” feature was essential in demonstrating how to think about design responsively.motor-proj1

Project 2 was to build an interactive experience for an indie band, that would allow the user to play music samples and access upcoming shows and ticket information. In some instances, video was also added to the experience.proj2a

Project 3 was their final project and they had two tracks in which they could go. Track one was to create an application prototype that parallels or enhances a current or past project from another design class. Track two was to design and create a prototype for a game. The game prototype not only had to mimic aspects of actual game play, but it also had to have a developed objective or storyline attached so potential users could decide if they did or did not want to play the game.game-proj3

Which of these projects was most exciting for your students?

The idea of having the opportunity to design a gaming concept was huge. In the later part of the semester, students had developed a confident skill set when using Hype, so they were eager to take bigger risks with the gaming track for the final project.

What surprised you when teaching the course? Any tips for educators planning a multi-week course with Tumult Hype?

Since it was my first time teaching a class with Hype as the primary conduit for mobile prototyping; I’d say many things. I was most surprised by the buy-in from ALL of the students once they discovered what Hype could actually do when implementing mobile prototype ideas and concepts. Once that was realized, I observed a very strong drive to push concepts and ideas much further when designing for mobile application experiences over web-only based designs. Mobile application design and development is certainly our current frontier.

My advice for educators would be to create an in-depth project for yourself that you would like to develop with Hype as the key development software. Take your own observations of discovery and apply that to the development of a class curriculum that provides the type of projects that you know your students wish they could create if only someone like yourself provided the opportunity.


 

Learn more:

Thanks for reading! You can follow Jake on Twitter @jseleven (and of course, we’re always listening at @hypeapp)

Made for you in San Francisco.