Chris Havranek's Portfolio

User Experience DesignerChris Havranek // Portfolio // [email protected]

Chris Havranek // Contents // [email protected]

BBB Marketplace AuditHello VikingUser Experience Specialist

Contents Target Back To CollegePeriscopeUser Experience Designer

Event Registration SystemPeriscopeUser Experience Designer

Internal Auto WebsiteAIMIAUser Experience Architect

Kellogg’s Mobile eCatalogAIMIAUser Experience Architect

Chris Havranek // Target Back To College // [email protected]

The Challenge: Target hosts numerous in-store after-hours events around the country for college students. Periscope was asked to plan and execute each event along with a mobile experience to accompany the events.

My Role: User Experience & Information Architect

The Solution: I worked with the team to create a responsive companion website that would deliver contextual content to students based on three phases of the campaign.

The Result: The online and offline portions of the campaign were executed with higher rates of engagement compared to years prior.

Target Back To CollegePeriscopeUser Experience Designer

When possible, content would only be served once and accounts are only required when absolutely necessary. I wanted students to have as few barriers

as possible to interact with the website.

School Selector

Home Screen

Key

Countdown Clock

Scratch to Win Lists Bus Stop

Locations Games Text to Win Survey Coupons Target.com App

Event Overview

Reveal Gift Card View Lists

Add a List

View Bus Stops

Favorite a Bus Stop

Play Games Take SurveyView Details Target.com App Details

First Visit Only

External Destination

Login Required

Edit List

Create Account

Coupon DetailsEdit Account

Map to Target

Google Maps

Text Message

Legal


Complete these challenges on event night to win swag!

View popular shopping lists for and create your own.

Pre-event Home Page

Like saving money? Our coupons help you save even more!

Target.com mobile navigation

Download the Target App

Target BTC Login

View all the buses to get to Target on event night.

Find out if you've won $X, $Y, or $Z!

Target Back To College

03 : 21 : 45 : 34

An after-hours event designed for your college kickoff.

Days Hours Minutes Seconds

During-event Home



Target BTC Login

Complete these challenges on event night to win swag!


View all the buses to get to Target on event night.

Find out if you've won $X, $Y, or $Z!

Text to win one of our fabulous prizes on the event night!


Let us know how the the event went with our quick survey.

In conjunction with the events team, I determined what content is most relevant to the students within the various

phases of the campaign.

Post-event Home page



Target BTC Login



Let us know how the the event went with our quick survey.

Find a Target store near you.


I lobbied to create a lighter desktop experience in addition to mobile—allowing for students to connect with our campaign regardless of what touchpoint they began at. The mobile website focused on delivering the full experience during the pre, during and post phases as these happened in a number of locations.


Having the opportunity to witness one of the events take place was an eye opening opportunity. Designing a mobile website to supplement an event before actually participating in the event can only go so far. Based on my observation that night I’m confident I can create an even better one next year.

The Challenge: A large medical provider offers classes to the public and aimed to improve their registration process on both the front and back end based on qualitative and quantitative feedback.


The Solution: I strategized a system that would streamline registering for classes based on feedback from the client and numerous working sessions to derive true issues.

The Result: The changes are in the process of being implemented and the client is very pleased with the potential for improvement.

Event Registration SystemPeriscopeUser Experience Designer

Chris Havranek // Event Registration System // [email protected]

At the outset, the client had a search form with numerous fields often being neglected. I moved away from this to a system that simplified the structure to a step by step process. Additional refinement options

are given to the user upon the initial search.

Googlehealthcarewebsite.comWebsite

Header & Main Navigation

Home > Classes & Events

Classes & Events< Back to previous page

Bronson offers a variety of education opportunities. To find a class or event, use the search tools below.

Step 3: TimeStep 2: Topics

Locations

Step 1: Location

Battle Creek

Kalamazoo

Radius15 Miles

Topics

Behavioral

Cancer

Childbirth & Parenting

Children

TimeThis Week

Search

Search all topicsAll Locations

Browse Classes & EventsSearch Classes & Events


Originally, users were required to submit their information for each individual class they registered for—demanding around

eight steps per class.

Search ClassesYes

Good results?

No

Refine Search

Need more details?

No

YesView event details

Bringing guests?

Yes

Yes

View Confirmation Page / Email

Enter personal information

Call / Email Customer Service

Enter billing information

Submit order

Confirm Information

Continue Shopping?


The optimized process I put forth allowed for users to quickly register for multiple classes with much fewer steps. Approximately, eight steps for as many classes as desired.

Search ClassesYes

Good results?

No

Refine Search

Need more details?

No

Yes

Add to basket

View event details

Continue shopping?

Yes

No

View Confirmation Page / Email

Enter personal information

Enter guest information

Enter billing information

Submit order

After the user has successfully registered for a class they are supplied with all the necessary class information up front and within an email. They may also choose to continue their journey within the website based on related content.


Googlehealthcarewebsite.comWebsite

Header & Main Navigation

Thank you!Completely impact multifunctional processes and wireless supply chains. Dynamically engage business meta-services for market-driven data. Collaboratively restore cross-platform users before client-centered manufactured products.

To cancel or modify any of your reservations please email us at [email protected] or call 555-555-5555. Please include your information when sending an email.

Alzheimer's Support Group

Hospital, Classroom 1123 John StreetKalamazoo, MI 49079

Location Details

Saturday 01/30/132:00-3:00PM

Date

MyselfJason StamosAngie Pinkman

Attendees

$30Price

Alzheimer's Support Group

Hospital, Classroom 1223 Jones StreetKalamazoo, MI 49079

Location Details

Monday 01/01/138:00-9:00AM

Date

MyselfAttendees

FreePrice

iCalOutlook

Google CalendarAdd to Calendar( ) Add to Calendar( )

PrintTell your friends you're going to XXX

Please bring comfortable clothing and apillow for yourself and each of your guests.

Class Notes

Related Services Find a Doctor

Service Title Service Title Service Title



Completely impact multifunctional processes and wireless supply chains. Dynamically engage business.

Find a Doctor

The Challenge: A leading American Automobile Company’s websites allows users to create collateral to display in locations to promote automobile parts and incentives. It was clear the experience was not ideal, and they came to our team to improve the layout and process.

My Role: User Experience & Information architect

The Solution: Walking through the user steps ourselves we saw that could be combined or eliminated. We also used current web standards and trends to influence our proposed changes.

The Result: The suggestions that our team put forth were accepted and helped to persuade the client of a website wide redesign which began shortly after this project.

Internal Auto WebsiteAIMIAUser Experience Architect

Chris Havranek // Internal Auto Website // [email protected]

Looking at the current process map there were several redundancies. We put forward

a map that moved from 11 minimum steps to seven. We also introduced a way for

users to save previously created templates.

Login

Home

Dynamic Publishing

Enrollment Authorization

Cancel

BAC Code Authentication

Valid?

No

Choose Division

Yes

Select a vehicle

Select Template

Select Accessories to

include

Are there accessories?

Yes

Adjust Settings,

Accessories, Contact, Logo

No

Download Low-Res

Download Hi-Res

Click to begin

Original Ideal

In this example, 4 pages a user would typically have to go through was condensed into one page. Less load times and the removal of a redundant login system will significantly reduce the time required to create collateral.

Chris Havranek // Internal Auto Website // [email protected]

Chris Havranek // Kellogg’s Mobile eCatalog // [email protected]

The Challenge: Kellogg’s existing catalog could be viewed on a mobile device, but it was identical to the desktop version. This didn’t provide an ideal experience for users attempting to browse the catalog. This platform was also used for other clients which needed a mobile platform for their catalog.


The Solution: Our team built a mobile template that can be used with any number of clients. This included taking advantage of common mobile phone functionality and best practices. This template also had to be neutral enough to allow for any company to insert their design requirements into it.

The Result: The architecture was implemented as planned and continues to be the default template that all clients using this platform utilize.

Kellogg’s Mobile eCatalogAIMIAUser Experience Architect

The mobile experience needed to include all aspects the

desktop did with an emphasis put on paths users would

typically pursue on a mobile device.

Email Confirmation

Home

Enter a Code

Rewards Catalog

Promotions and

CouponsHow It Works Points

BrowseFilter by:

categories and/or points

Enter Single

Product View

Results?

Error Message

Logged In?Login

Register

Size, Color, or Other Options?

Select Option

User Has Enough Points?

No

Yes

Yes

No

"Get It" Button

View Products in

CartContinue Shopping Checkout

No

Yes

No

Enter Shipping &

Contact Info

Cached and/or

SSO Info passed

Valid Info?

Error Message NoConfirm

Order

Yes

ConfirmCancel No

Successful Order?

Yes

Error Message

Success Message

YesNo

1.0.0

2.0.0 3.0.0 4.0.0 5.0.0 6.0.0

3.1.0

3.2.0

0.1

0.2

3.3.0

3.3.1

3.3.2

3.3.3 3.3.4


Navigation and content needed to be reconsidered when moving from desktop to mobile. Removing any extra content

allows users to quickly find what they’re looking for.


Forms that normally span multiple pages are reduced when possible and field titles are imbedded within the field itself. Minimizing page load times while keeping scrolling as low as possible was key on these pages.

The Challenge: The Better Business Bureau looked to understand their current and prospective customers more thoroughly. The online landscape has been changing rapidly, but what can the BBB do to remain relevant?

My Role: User Experience & Research analyst

The Solution: Hello Viking used previous research conclusions, online surveys, and focus groups to determine where the BBB stands.

The Result: The team processed hundreds of online survey results and conducted three focus groups. I worked to turn the data into relevant conclusion that the BBB can use to further their business objectives.

BBB Marketplace AuditHello VikingUser Experience Specialist

Using a survey service we received hundreds of online results. We used insights from these quantitative insights to help create a qualitative guide for the focus groups.

Chris Havranek // BBB Marketplace Audit // [email protected]

Chris Havranek // BBB Marketplace Audit // [email protected]

PAGE©2010 Hello Viking LLC 3

Who we talked to

3 focus groups (ranging in size from 4-8 people)

• 1 group of men with mixed familiarity (most less familiar with BBB, but one was a small business owner with past experience as an accredited business, 20s-40s)

• 1 group of primarily older adults (mixed gender, 30s+) with familiarity/experience with BBB (one respondent was younger and unfamiliar)

• 1 group of younger adults (20s) with limited experience/familiarity with the BBB

The three focus groups allowed us to delve deeper into questions derived from earlier in the project. Afterwards, the team and I created a set of recommendations backed by strong data sets.

User Experience Designer [email protected]

Chris Havranek

Career

Chris Havranek's Portfolio