Prototyping

After a visual direction has been decided on, the next step of my design process is to show a more hi-fidelity version of what the final product will look like and what users can expect while interacting with it. This could include interactive prototypes, simulation of interactions, user flows and more detailed design comps.


prototype for 'What's the q?' interactive game

I designed static wireframes, followed by an interactive prototype for a native iOS game to be played on a 9-panel television screen. It was important for the client to see their brand standards upheld, while still having the look and feel of a game show. This prototype allows for the user to become familiar with the interactions within the game, the user flow, all before the game goes in to development.  
Tools Used: Photoshop, Invision
Agency: Centerline Digital
Role: UI designer, interaction designer


PCORNET COMMONS MOBILE PROTOTYPE AND USER TESTING PLAN

Mobile and Desktop Prototype
Providing the client with a mobile prototype, even if they're unfamiliar with mobile design, helps translate the idea of responsive website in to reality. I made an interactive prototype, displaying the interactions a user would face during the mobile and desktop experience.

Usability Testing Plan
Working directly with a UX Strategist, we preformed a usability test to gain insight to the overall user experience and effectiveness of the site. We observed users interacting with the prototype, paying particular attention to certain aspects of the site.

Usability Testing Results
After moderating 8 users through the process, it was found that the overall experience of the site was positive; all users thought the experience was visually engaging and interesting. However, we did uncover a couple of items that could improve users understanding of the PCORnet Commons site.

Tools Used: Sketch, Invision
Agency: Centerline Digital
Role: UI designer, interaction designer

pcornetcommons_mobile.gif