UX Portfolio

Who What Wow

A proven User Experience Leadwho can deliver exceptional solutions on time, every time.

2

Methodologies

Over five years of experience in Agile, & a decade in Waterfall.

Backlog

Scrum

Planning

Retrospective

Dev

Review

Next

Whether preparing detailed design specifications and functional requirements or rapidly generating ideas for a story wall—whatever the process—I can assure that the ideas are communicated clearly & effectively.

#Adaptable

3

Hills

Explore Evaluate

Sponsor User

Understand

Playbacks

Prototype

IBM Design Thinking

Paradigms

In the midst of the biggest paradigm shift in 50 years.

As a life-long learner, I’m fascinated by the shifting world of design and following the leaders closely. I’ve been to workshops at IBM’s world headquarters for design in Aus-tin and follow Google Ventures weekly.

#Learner

Google Ventures Design Sprint

Understand Diverge PrototypeDefine Decide Validate

4

For the Women We Love WireframesVersion 1.0 published October 24, 2012 by Brian Marczak ([email protected]) 4 11of

Home Page as viewed by Persona B

© 2012 For the Women We Love. All Rights Reserved. Terms & Conditi ons | Privacy PolicyFor the Women We Love is a 501(c)(3) under federal tax guidelines.

Raising Awareness of GYN Cancers For the Women We Love Stay Updated! Join Our Newslett er

FIND ANSWERSStart HereTypes of CancerCancer StagingStandard of CareSurgeriesChemotherapyClinical TrialsSide Eff ects & PainHow to Find the Best CareCompleti on of Treatment

TAKE ACTIONNavigati on GuideEducati onal MaterialsKnowledge BaseSymptoms AssessmentResources & ProgramsCare & PlanningNutriti on & Dietary NeedsComplimentary TherapiesExercise Programs

GET SUPPORTCommon IssuesFinancial ProgramsIn-home Services Transportati onCancer & Your Career

MAKE CONNECTIONSBenefi tsFind a Support Group Upcoming EventsHelping OthersNavigati on Training

WHO WE AREOur TeamOur ApproachProgramsPartneship Opportuniti esVolunteeringPress & Contact

FINDANSWERS

GETSUPPORT

TAKEACTION

MAKECONNECTIONS

WHOWE ARE DONATE NOW

For support, call (678) 420-4129 or [email protected]

If you have been recently diagnosed with cancer,lorem ipsum dolor sit amet consectetur adipiscing elit.

START HERE

UPCOMING EVENTS

FIND ANSWERSLorem ipsum dolor sit amet, consectetur adipiscing elit. Vesti bulum accumsan consequat felis eget ullamcorper mauris id facilisis nisi.

Learn More

TAKE ACTIONAliquam posuere vehicula tellus id consequat. Aenean eros risus, sollicitudin quis ultrices id, varius eget quam. Praesent eget massa erat, in malesuada enim.

Learn More

GET SUPPORTAliquam erat volutpat. Duis eget est et sapien lobor ti s varius. Aenean rutrum odio sed lorem auctor quis malesuada dolor molesti e.

Learn More

OCT

23North Georgia Women Surviving CancerEvent Details

OCT

252012 Atlanta Ovarian CycleEvent Details

OCT

27Owareness: Ovarian Cancer May Whipser, but WE ARE SHOUTING FOR A CURE!Event Details

OCT

29Teal To Heal: A Fashion EventEvent Details

OCT

31Walk of WomenEvent Details

View All Events

RECENT EVENTS

Walk for the Women We Love

B

User Research

Contextual inquiry, user interviews, persona development & experience mapping.

As an independent consultant, I helped For the Women We Love, an Atlanta-based women’s cancer support center, develop perso-nas which were used to build an understanding of the needs of their clients. The personas were used to design and develop their content strategy, website, and outreach collateral.

THE NEWLY DIAGNOSED

Jenny Reed

I don’t even know where to begin — I just need answers. I need to know what to expect.

Level of Experience

Knowledge of Cancer

Extent of Support Network

Frequency of Interaction

Frame of MindJenny has just been diagnosed. She is frightened and extremely anxious — possibly even frantic — and she may feel emotionally numb.

GoalsFeeling overwhelmed, Jenny may find it hard to formulate questions or even know which questions to ask. When she can, she may ask some of the following:

• What is my diagnosis? Where can I learn more about my disease?• What are my treatment options?• What is the survivability of the disease?• How might the various forms of treatment affect me?• How do I find the best treatment?• Who can I talk to who will understand what I’m going through?

Jenny needs to know what to expect. She may also be looking for confirmation of her experience thus far.

Measuring SuccessA successful interaction may result when Jenny:

• Makes contact by phone • Makes contact via email• Opts in to a mailing list (a newsletter or an upcoming event)• Downloads a PDF• Attends an event

”

User Persona A

Level of Experience

Knowledge of Cancer



THE PATIENT IN TREATMENT

Karen Butler

I need help, I just don’t know if

there’s anyone who can help me.

Frame of Mind

While she appears stoic, it is apparent that Karen is exceedingly worried

and wants to regain a feeling of control.

GoalsKaren wants to know how she can be actively involved in her own treat-

ment. She’s seeking information regarding:

• Types of treatment

• Efficacy of prescribed treatment

• Side effects

• Integrative or complimentary therapies

• Clinical trials

• Second opinions

Generally, Karen needs resources for a variety of issues that will affect her

life during treatment. She may be seeking assistance with:

• Work-related issues

• Financial issues

• Transportation

• Integrative or complimentary therapies

• Nutrition and excercise

Measuring Success

A successful interaction may result when Karen:

• Makes contact by phone

• Makes contact via email

• Requests financial help

• Opts in to a mailing list (a newsletter or an upcoming event)

• Downloads or prints a PDF

• Attends an event

• Makes a donation

”

User Persona B

Level of Experience

Knowledge of Cancer



THE SURVIVOR

Suzie Mullane

I want to connect with others who

have faced the same challenges

that I have.

”

User Persona C

Frame of Mind

Suzie is happy, but she still experiences moments of fear and isolation

much like those she experienced during treatment. It is clear that she ben-

efited from the interaction involved in treatment and that she now, at times,

feels lonely. Further, she may experience what is commonly referred to as

“survivor’s guilt” and may show signs of trauma. Suzie may be ready to

reach out to others and listen to the stories of other patients and survivors.

Goals

Depending on whether her medical team has addressed survivor issues,

Suzie may have questions about what to expect after her treatment:

• What comes next? What about follow-up visits?

• How do I prevent a recurrence? What should I look for?

• How can I tell what is a “normal” post-treatment sensation versus

something to be concerned about?

• What are the signs of trauma? Will I recover physically and emotionally?

• What is “normal” now?

In order to recover emotionally and regain confidence, Suzie needs to share

her experiences with others. She may want to give back in some way or

volunteer to help others.

Measuring Success

A successful interaction may result when Suzie:

• Makes contact by phone

• Makes contact via email

• Requests financial help

• Opts in to a mailing list (a newsletter or an upcoming event)

• Downloads or prints a PDF

• Offers to volunteer

• Attends an event

• Makes a donation

#Empathy

For the Women We Love Website as Viewed by Persona B

5

TaaS Transcoding Profile Creation WorkflowVersion 4 published March 27, 2009 by Brian Marczak ([email protected]) 1 17of

The Transcoding Profile Creation Workflow

Create EgressSub-profi le


Does Source EgressSub-profi le Exist?

Does Metadata EgressSub-profi le Exist?

Create IngressSub-profi le

UploadWatermark

Create MetadataSub-profi le

Create SignalingSub-profi le

Create SignalingSub-profi le

Create OutputSub-profi le


New Transcoding Profi le

Save

Does IngressSub-profi le Exist?

Does WatermarkExist?

Does MetadataSub-profi le Exist?

Does SignalingSub-profi le Exist?

Does Error SignalingSub-profi le Exist?

Does OutputSub-profi le Exist?

Does EgressSub-profi le Exist?

1

2

3

The revised transcoding profile creation workflow enables users to move quickly through the process of creating complex transcoding configurations. Concise layouts, readily available guidance, common features, and the option to edit and repurpose existing sub-profiles significantly improve usability.

Rationale

Following the logical decision tree shown here, the workflow has been divided into three concise segments. The main design concept is to progressively disclose more advanced features at each level. Initially, in the first step, users are presented with the core features: choose an ingress point, choose a metadata sub-profile, choose an egress point, choose whether the files will be moderated. And at each level, users are invited to choose whether to use additional secondary features.

This simplified sequence will help novice users expedite the transcoding profile creation process by directing their attention only to features they are most likely to find useful.

Solution

The transcoding profile creation workflow is designed to guide a user through the steps necessary to complete the complex task of creating a new transcoding work-flow. Only two steps are required in the revised version.And as you’ll see, the first time a user undertakes this task, many of the decisions are pre-determined.

Clearly titled pages and streamlined features improve the application’s learnability, while a new flexible work-flow and the ability to edit sub-profiles reduces the error rate. In addition, the ability to choose multiple sub-pro-files in a common manner greatly improves efficiency.

Concepting

Concept flows serve as a fast and easy way to present ideas for stakeholder validation.

As I’ve been using Adobe products for over 15 years, Photoshop, Illustrator, and InDesign are second-nature to me, so while I’ve tested other products like Axure and OmniGraffle, concepting and wireframing in Adobe is much faster. And, with the seamless integration between products, delivering pixel-perfect wireframes makes the rest of the team much faster too.

#Ideation

6

Primerica App Walkthrough

For internal use only. Not to be used with, or distributed to, the public.

August 25, 2015

7 9of

PREPARED BY DATE VERSION

EMAIL PHONE

Brian Marczak

[email protected] (470) 564-7674

1.0.7

AT&T 95%12:00 PM

-1:120:01Done

Getting Started Video

Get started by following these three steps:

1) Import a list of your bestcontacts

2) Qualify them (which givesthem a score)

3) Set Appointments withcontacts scoring 4 & 5

Your Field Trainer:David Turley(770) [email protected]

Watch the video to learn more:

Get startedSkip

Getting Started

Onboarding Intro*O1

First time thru?

Yes

Yes

Yes

No

No

No

Use the STEAM method to remind you of names:

SalespersonTeacherEnthusiasticAmbitiousMost Competitive

Friends, family, neighbors, sports buddies – don’t leave anyone out!

Step 1: Import Contacts

Select contactsSkip

Step 1 Instructions*O2

Watch

Continue? Continue?

Video: Getting StartedGSV

Sign In

Need help?

Rep ID

Password

Message

Twitter

Primerica

Calendar

Facebook

Google

Settings

Photos

Contacts

Phone Mail MusicSafari

Monday

Tap the Menu icon in thetop left corner to revealthe navigation menu.

Home

App Intro 1*I1.1

Connect with your team instantly via Spark, whereyou can chat with your

team, share photos, video & audio, all in one place.

What’s News 1*N1.1

Use the menu to view company news, check your status & standings, access

tools, and get help.

HomeTools Financial Calculators Mobile FNA Quick Quote

App Intro 2*I1.2

Got questions?Use the new Support Center to find answers about sales tools, applications and more!

?


The Search icon offers easyaccess to marketing tools & training videos, as well as

speeches, stories and more.

Home

App Intro 3*I1.3

The Utilities icon providesaccess to Preferencesand functions such as

Print and Email.

Mobile FNA

App Intro 3*I1.3

The Notifications iconalerts you to items that

need your attention.

Done

Home

App Intro 3*I1.3

Now you can accessAuto & Home

directly from the Toolssection of the main menu.

Done

HomeTools Auto & Home Financial Calculators Mobile FNA


Now it’s time to qualify your contacts. You’ll choosewhich options apply to each contact:

Home OwnerEmployedAge 25-55MarriedChildren

If nothing applies, choose ‘None.’

Step 2: Qualify Contacts

Qualify contactsSkip Set appointmentsSkip

Now, you’ll work with your Field Trainer to set appoint-ments. In the following list, your contacts are ranked by their Qualified Score. Tap a name for phone numbers. Tap the calendar icon to set an appointment.

Your Field Trainer:David Turley(770) [email protected]

Step 3: Set Appointments

Import

Dalton Abrams

�m Adams

Lauren Holden

Lindsey Johnson

Michael Jordan

Carrie Lloyd

Jerry Lowe

Herbert Moog

Import Contacts*O3

Dalton Abrams

�m Adams

Credibility Rating

Credibility Rating

Favo

rite

Hom

e Ow

ner

Emplo

yed

Age

25-5

5

Mar

ried

Child

ren

None

Save Qualifications

Dalton Abrams

�m Adams

Lauren Holden

Lindsey Johnson

Michael Jordan

Carrie Lloyd

Jerry Lowe

Herbert Moog

5

5

5

5

5

5

4

4

+

+

+

+

+

+

+

+

Done

12 Appointments Scheduled

Keeping your pipeline full with qualified contacts and appointments is the best

way to grow your business!

Great Start!

Finish

10+

Step 2 Instructions*O4 Batch Qualify*O5 Step 3 Instructions*O6 Set Appointments*O7 Completion*O8

Continue? Continue?

AT&T 95%12:00 PM

Home

HomeH

Any new features?

Authentication*A

SYSTEM New Rep?

Scenario GThe user launches the Primerica App on POL. Upon signing in, an optional on-boarding process begins

for new reps, while existing reps are presented with general information about navigating the app.

User System

Usability Testing

A quick-and-dirty usability test enables us to validate whether people will be able to use the product as intended.

When I began prototyping, there weren’t any tools. I hand coded everything myself in ActionScript. Now, a variety of tools make getting prototypes into the hands of stakeholders and sponsor users faster than ever. I’ve tested Axure, Pixate, Proto.io, UXPin, et al., but currently my preferred tool is InVision.

http://invis.io/DM27NCEQC#Strategic

7

Mobile Registration Workflow


August 26, 2015

1 3of


EMAIL PHONE

Brian Marczak


1.0.0

Account

Primerica Online Registration

95%12:00 PMAT&T

You must complete registration for each role that

you hold. Which role would you like to register at

this time?

Continue

It looks like we have more than

one record on file

A rep in Abbey Greene’s base shop

Abbey Greene’s office staff

RVP Antonia Sullivan

RVP Antonia Sullivan’s office staff

I have a specfic solution number

IBA Lookup

Account Setup

Service Level

Payment Info

Which Solution Number would you like to register?

Account


95%12:00 PMAT&T

What’s your date of birth?

And your SSN/SIN?

Don’t worry—your information will be transferred

through a private, secured connection.

If you run into any problems, you can get help

by tapping the icon or by calling the Primerica

Help Center at 1-888-737-2255.

Search

Welcome

IBA Lookup

Account Setup

Service Level

Payment Info

Let’s start by looking up your IBA

Account


95%12:00 PMAT&T

Terms of Use

I Agree

One more thing...

IBA Lookup

Account Setup

Service Level

Payment Info

View PDF

Blandam vellorum latatas pelluptas mo

dictem undaercia duciae esto eum lamidus

aut eaquundit, vel et enitatem quasinc

tibearumetus enimust, officaecte sum quis

dem et aut odionec tatio.

Perovidita nonseque volorpos et quam

fugitaque con necepe ommodis sum sedi

dignihil incipis autemqui ut et que ne quo

desto bla elenihit.

Faceat ates aut ligenet as entium la miliquo

eatium harum facepel essinum ilibus estis

ressi optae. Nam necus prent utatesti dolupid

IBA LookupR1

AgreementR4

Account


95%12:00 PMAT&T

You must complete registration for each role that

you hold. Which role would you like to register at

this time?

Continue

It looks like we have more than

one record on file

A rep in Abbey Greene’s base shop

Abbey Greene’s office staff

RVP Antonia Sullivan

RVP Antonia Sullivan’s office staff

I have a specfic solution number

IBA Lookup

Account Setup

Service Level

Payment Info

Account


95%12:00 PMAT&T

No problem, a representative at

at the Primerica Help Center can

clear this right up.

IBA Lookup

Account Setup

Service Level

Payment Info

Call 1-888-737-2255

Account


95%12:00 PMAT&T

Please verify the following information.

That’s correctThere’s a typo

Great, let’s setup your account

IBA Lookup

Account Setup

Service Level

Payment Info

Solution Number

Name

Title

RVP

Home address

Not Assigned

Robin Zaragamba

Associate

Antonia Sullivan

12398 Winona Drive,

Broomfield, CO 80020

Account


95%12:00 PMAT&T

Please choose a service level

IBA Lookup

Account Setup

Service Level

Payment Info

Primerica

Online ID Primerica

Email Virtual

Base Shop Home Office

Bulletins Personal

Information Compliance

Information Training &

Development Primerica

Playbook PFN TV Millionaires In

Training Production

Leaders Business

Essentials TurboApps FNA, Quick Quote,

and more Primerica Online IDs

for your team Primerica Email

for your team Your own personal

Primerica website

FULL SERVICE

$99

PRIMERICA ONLINE

$49

LIMITED SERVICE

NO COST

Select

Take advantage of Primerica Online’s amazing

training and development!

Duplicate RecordsR1B

IBA ErrorR2B

VerificationR2 Service LevelR5

Account


95%12:00 PMAT&T

Next

Choose a username & password

IBA Lookup

Account Setup

Service Level

Payment Info

Username

Password

Strength

And provide your answer

Choose a secret question for password recovery

Account


95%12:00 PMAT&T

How would you like to pay?

IBA Lookup

Account Setup

Service Level

Payment Info

Pay by credit card

Mail a check or money order

Next

Account


95%12:00 PMAT&T

Credit Card Info

Billing Address

IBA Lookup

Account Setup

Service Level

Payment Info

Confirm Order

Name on card

Card number

Street address

Street address

Security code

City

Country

Expiration date

State

ZIP code

Account


95%12:00 PMAT&T

IBA Lookup

Account Setup

Service Level

Payment Info

Submit Payment

Your Visa card will be charged

$99.00 for Full Service access.

Name on card

Card number

Security code

Expiration date

Billing address

Robin Zaragamba

4568 6832 5455 5782

247

08/15

12398 Winona Drive,

Broomfield, CO 80020

Account


95%12:00 PMAT&T

Congratulations! Your account

setup is complete.

Continue to Login

Your Solution Number is

WIN15

Your Primerica email address is

[email protected]

Account


95%12:00 PMAT&T

IBA Lookup

Account Setup

Service Level

Payment Info

Please send your payment of $49.00 to the

address below:

Primerica Financial Services

1 Primerica Parkway

Duluth, GA 30099

Make your check or money order payable to

Primerica Financial Services and include your

solution number in the memo.

Your service level will be limited

until your check or money order

is received and processed at the

Home Office.

Next

Account SetupR3

Payment MethodR6

Credit Card InfoR7B Payment ConfirmationR7C

CompletionR8Pay by MailR7A

No

Yes

DuplicateRecords?

Scenario AThe user downloads the Primerica App, installs it and launches it, then follows a registration link

on the Authentication page to the workflow below to complete the registration process.

User System

Usability Testing

High-fidelity prototypes enable us to validate the emotional impact created by the experience.

Towards the end of a project, more refined prototypes are in order. These provide confidence in the process and enable stakeholders to preview new features.

http://invis.io/DY25DL5BN

8


May 7, 2015

39 49of


EMAIL PHONE

Brian Marczak


2.0.5

Team Stream Appendix B

Matthew Thorpe DEC 31, 2014

Message one, occus core lab ilit entiosa al in etur, assitatur alitati untur imperdiet.

3

Yasmin Fleming JAN 2

Message two, suspendisse eu mollis diam, non maximus metus. Fusce convallis dictum.

3

Spencer Ellis Yesterday

Message three, eu commodo an elementum quis.

YF

MT

SE

Team Stream

95%12:00 PMAT&T

Stream View

Base Team Stream Font Styles

font-family: ‘Open Sans’, sans-serif; font-weight: 400; font-size: 16px;

App Header

background: #666; color: #fff;

Author Initials

font-size: 18px; background: #999; color: #fff;

Dividing Line

background: #d9d9d9;

Online Status Indicator (See Team Stream Sprites)

Offline Status Indicator (See Team Stream Sprites)

Author Name

font-weight: 600; color: #666;

Date

color: #999;

Message Body

line-height: 20px; color: #000;

Like Button (.PRIcons_thumbs-up)

color: #999;

Like Button Active (.PRIcons_thumbs-up)

color: #0c76d7;

Likes Count

color: #999;

Compose Button (.PRIcons_pencil)

background: #0c76d7; color: #fff; width: 56px; height: 56px;

Delete Button

font-size: 18px; color: #fff; background: #a00000; background: -webkit-linear-gradient(top,#a00000 0%,#cc0000 4%,#ef0000 25%); width: 120px; height: 100%; //120px if height exceeds 160px

E

F G

K

J

D A

B

C

D

E

F

G

H

I

J

K

L

I

B

C

A

H

Stream StylesStyle Specifications

Yasmin Fleming JAN 2

Message two, suspendisse eu mollis diam, non maximus metus. Fusce convallis dictum.

3

Delete


Message one, occus core lab ilit entiosa al in etur, assitatur alitati untur imperdiet.

3


Message three, eu commodo an elementum quis.

MT

SE

Team Stream

95%12:00 PMAT&T

Delete Button

L

3349of

VERSION

2.0.5

Team Stream Appendix A

Smartphone Metrics


Message one, occus core lab ilit

entiosa al in etur, assitatur alitati

untur imperdiet.

3

Yasmin Fleming J

AN 2

Message two, suspendisse eu

mollis diam, non maximus metus.

Fusce convallis dictum.

3


Message three, eu commodo an

elementum quis.

YF

MT

SE

Team Stream

95%

12:00 PM

AT&T

10

10

auto

10

18 px

1628 px

56 px

32 px




untur imperdiet.

3

Yasmin Fleming J

AN 2




3



elementum quis.

YF

MT

SE

Add a comment...

Team Stream

95%

12:00 PM

AT&T

10

10

10

10

32 px

32 px

auto

max-width: 216 px




untur imperdiet.

3

Yasmin Fleming J

AN 2




3



elementum quis.

YF

MT

SE

Team Stream

95%

12:00 PM

AT&T

11 px

11 px

16 px

22 px

11 px

32 px

16 px

56 px

28 px




untur imperdiet.

3

Yasmin Fleming J

AN 2




3



elementum quis.

YF

MT

SE

Add a comment...

Team Stream

95%

12:00 PM

AT&T

max-height:

66% of total

available

height

10 px

10 px

10 px

10 px

33 px

Stream View, Horizontal Spacing

Compose Dialog, Horizontal Spacing

Stream View, Vertical Spacing

Compose Dialog, Vertical Spacing

Metrics

Yasmin Fleming J

AN 2




3

Delete




untur imperdiet.

3



elementum quis.

MT

SE

Team Stream

95%

12:00 PM

AT&T

120 px

100% of container height unless container height

exceeds 160px, then height should be 120 px

Delete Button

Requirements

WOrk SAmple Detailed functional specifications

#Focused

When working with a larger team, functional specifications ensure no detail is left in question.

9

With built-in source control, we chose a simple MediaWiki to host our styleguide and design resources which enables the entire design team to contribute to the effort.

Styleguides

WOrk SAmple living styleguides & custom icon fonts

10

We use Density-independent pixel sprite sheets to accelerate load times and future-proof our applications for screens up to 4K.

Styleguides

WOrk SAmple Future-proofing

/images/sprite.png

/images/iphone/[email protected]



/images/android/res-ldpi/sprite.png

/images/android/res-mdpi/sprite.png

/images/android/res-hdpi/sprite.png

/images/android/res-xhdpi/sprite.png

/images/android/res-xxhdpi/sprite.png

/images/android/res-xxxhdpi/sprite.png

@1x @4x

11

For Primerica Now, we used cards to group together information in an intui-tive way, enabling the user to easily scan through a lot of content and pinpoint the information most relevant to them.

Delivery

WOrk SAmple primerica Now

12

Delivery

WOrk SAmple primerica reports

For Primerica’s reports, we tool inspiration from Google Material and used thumb-based navigation for standard-sized smartphones to enable users to navigate through the app using only one hand.

#Restorative

How might wereduce complexity

foster understandingeliminate uncertainty

promote innovationimprove efficiency

create value

?

Collaboration

IDEO HMW

Every problem is an opportunity for design. By framing our challenge as a How Might We question, we’ll set ourselves up for innovative solutions.

www.linkedin.com/in/brianmarczak

[email protected]

1–802–345–1234

CONtACt

Thanks!