My role
I was one of the two visual and UX designers in this project. We teamed up with some of the best talents at the agency, leadership and creative wise to create this unique and much needed tool. I was part of the concepting and design process of the tool's front end, built up multiple clickable/interactive prototypes, also created a detailed style guide, and designed the customer's generic landing page and log in screen.
01_Concepting & Design
We were given a very high level design approach with some cool ideas and a lot of potential. We were asked to improve it and to optimized the overall experience to the max. Each journey consist on: a member home screen, a member detail screen, an episode selector screen, multiple episode screens and an end screen.
We created 8 different personas, with similar conditions but with different backgrounds. For this we had a big casting, a photoshoot and photo editing sessions making this tool even more unique. Each journey was assigned a specific color pallet and a pattern to emphasized the diverse breath of these fictional Aetna members. And the result of it, was a bold by friendly look and feel.
Some of the cool features this tool has are the voice overs and the animations. In almost every single screen there is an audio option with controls that tells the story in more detail about each member and in some few, there are some playable simple animations that support the data given and displays some Aetna products.
02_Prototypes
A master prototype was created in Invision so we all had a closer feeling of what the final product could be. Due to some technical difficulties that delayed development, we had to come up with solutions to provide clients the best experience possible so they could start promoting Aetna in the meantime. Our first solution to this was to make the best use of Invision, but unfortunately we were not able to add the audio voice overs to that prototype. Then, we heard about Proto.io. An excellent tool that creates seamless clickable prototypes of all kinds. With this new tool, we were able to add the audios (default controls) and the animations for the Aetna products. Also, we were able to add some cool transitions specially for the overlay screens such as menus, footers with disclaimers and end screens.
These prototypes are password protected.
So message me if you want to check them out! Trust me, is worth it!
So message me if you want to check them out! Trust me, is worth it!
03_Styleguide
For a more efficient communication with the development team and thinking about any future designers that might take over this project, we created a detailed styles guide with everything you need to know about Panorama. From color pallets, to UI forms, iconography, photography, typography and much more. You can take a look at this style guide here.
03_Customer landing page & Log in screen
A generic customer landing page was also designed as give away for some clients, so they can view customized information related to their companies and Aetna. Thru this page, they can also download the presentation that is unique for them or they can launch it on their server. The other way a customer can get access to this presentations after a pitch is through a log in screen with a protected password, so only those with the pin can view the presentation.
