designing ux for a content blog

46
Designing UX of a Content Hub/Blog for University of Phoenix Company Confidential

Upload: anuthanedar

Post on 15-Jul-2015

208 views

Category:

Education


2 download

TRANSCRIPT

Page 1: Designing UX for a Content Blog

Designing UX of a!Content Hub/Blog for University of Phoenix

Company Confidential

Page 2: Designing UX for a Content Blog

Company Confidential

Timeline2 Weeks

User Centered Design Methods Applied:

My RoleUX Designer, Content, and Brand Planner

Team1 UX Designer, 1 Visual Designer, 1 Digital Producer Client

University of Phoenix

Understanding Startup’s !

User Experience & Business Goals

User Research!Persona

Market Research

Feature Ideation Brainstorming

Visual DesignSketching & Wireframing

Internal & !Client Reviews

Page 3: Designing UX for a Content Blog

Business Case-!Why Create a Content Hub/Blog?

Company Confidential

Page 4: Designing UX for a Content Blog

Company Confidential

The Current Expectation is That TV is The Right Channel To Drive Business Results

Page 5: Designing UX for a Content Blog

Company Confidential

But There is a Huge Gap Opportunity Being Left On The table

TV Reach - Online Content Reach +

Page 6: Designing UX for a Content Blog

Company Confidential

Current Marketing Only Addresses The Very Early And Late Stages of the Journey

Page 7: Designing UX for a Content Blog

Company Confidential

Content Hub and Good User Experience

Page 8: Designing UX for a Content Blog

Company Confidential

So What Would Be a Content Hub? And What Would be It’s Need?

Page 9: Designing UX for a Content Blog

Company Confidential

So What Would Be a Content Hub? And What Would be It’s Need?

Page 10: Designing UX for a Content Blog

Company Confidential

But There is a Huge Gap Opportunity Being Left On The tableContent Blog Funnel Reach

Page 11: Designing UX for a Content Blog

Company Confidential

Editorial Content Buckets

Page 12: Designing UX for a Content Blog

Company Confidential

Unpacking an ‘Ad’vertorial v/s an Editorial

Page 13: Designing UX for a Content Blog

Company Confidential

So Then How Would An Example Content Blog Post on ‘Nursing’ Look Like?

Page 14: Designing UX for a Content Blog

Design Thinking and!User Experience Process

Company Confidential

Page 15: Designing UX for a Content Blog

Company Confidential

Whiteboarding Market Research and the Design Intent

Company Confidential

Presented market research to the internal team & the design UX guidelines for the blog.

Page 16: Designing UX for a Content Blog

Company Confidential

But There is a Huge Gap Opportunity Being Left On The tableBrainstorming Different Experiences for the Blog

Presented the different experiences, opportunities, do’s and don’ts that the blog could offer to the users. e.g- How quick a read a Nursing article is.

Page 17: Designing UX for a Content Blog

Company Confidential

Content Hub Design Guidelines

!

Content-centric I Visual I Informative I Engaging I Easy to find specific info I Ease of navigation I Storytelling !

Own one domain area- Clear Focus & Specificity Content-centric Visual + Informative Engaging Storytelling Easy to find specific info Ease of navigation !

Grid structure of visual + words Pops of color Visible ratings/ reviews/ recommendations Social layer integrated with content, Easy share !

Page 18: Designing UX for a Content Blog

Company Confidential

Wireframes (Tablet & Mobile)

Company Confidential

Page 19: Designing UX for a Content Blog

Search

Choose one which you relate the most to and let us customize your experience.

Which field are you interested to know more about?

Check Out Nursing

Nursing Marketing Management Psycology

Criminal Justic Lorem Ipsum Lorem Ipsum Lorem Ipsum

Footer

Or

You can switch back to

Binge Blog Me

Icons

Button Visible after a choice ofselection

Takes to the all general blog page

Need time to decide which field is right for you? No problem, we got you covered:

Page 20: Designing UX for a Content Blog

Search

HOW CAN PHOENIXHELP

CURRENT INDUSTRY NEWS

EDUCATION &CAREER PLANNING

Blog Title Blog Title Blog Title

CATEGORY: NURSING

Blog Title

Trending20 Views 20 Likes

Blog Summary Blog Summary Blog Summary Blog Summary Blog Summary Blog Summary Blog Summary Blog Summary Blog Summary Blog Summary .

8 mins

Nursing - Industry News

15 mins Read

Blog Title

Must Read20 Views 20 Likes

Nursing - Current Industry News

15 mins Read

Blog Title

Popular20 Views 20 Likes

Nursing Industry News Career Pl..

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

15 mins Read

Blog Title

Popular20 Views 20 Likes

15 mins Read

Blog Title

Must Read20 Views 20 Likes

Nursing - Current Industry News Nursing - Current Industry News

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

15 mins Read Blog TitleBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

20 Views 20 Likes

15 mins Read Blog TitleBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

20 Views 20 Likes

15 mins Read Blog TitleBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

20 Views 20 Likes

15 mins Read Blog TitleBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

20 Views 20 Likes

This Week (June 17- June 23)

Past Week, June 10th - June 16th

May, 2014

15 mins Read Blog TitleBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

20 Views 20 Likes

15 mins Read Blog TitleBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

20 Views 20 Likes

15 mins Read Blog TitleBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

20 Views 20 Likes

15 mins Read Blog TitleBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

20 Views 20 Likes

Name

Email Address

Submit

Area of Interest

Get Latest Industry News Delivered to Your Inbox

Blog Title

Blog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

TwitterShare Linkedin

Read Later

Read Now

Footer

Hover State to quickly get to past articles

See WhatYou Missed 2014 March February January

Make ‘Nursing’ Your Default Blog View?

You wont have to choose categories again. You can switch back to other categories anytime from the top navigation bar.

Yes Remind May Be Later

Powered by Univeristy of Phoenix

April

Sticky nav

Make ‘Nursing’ Your Default Blog View?

You wont have to choose categories again. You can switch back to other categories anytime from the top navigation bar.

Yes Remind May Be Later

Icons for lunch, commute, snack time & breakfast time reads

Cookie enabled Views Cookie enabled likes. Don’t require signing in Based on likes v/s Views logic

Cookie enabled likes. Don’t require signing in

Content arranged in a time recent manner

Content from the previous weeks is arranged per popularity

User enters an email address and article can be emailed or could possibly use ‘Evernote’ type apps

Goes to article view

Rolls out from right

Rolls out from right

VIEW ALL

Content from the last month has smaller tiles and is arranged per popularity

Page 21: Designing UX for a Content Blog

Search

INDUSTRY NEWS

CATEGORY: Undecided- Binge View

15 mins Read

Blog Title

Must Read20 Views 20 Likes

Industry News - Nursing

15 mins Read

Blog Title

Popular20 Views 20 Likes

Nursing Industry News Career Pl..

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

15 mins Read

Blog Title

Popular20 Views 20 Likes

15 mins Read

Blog Title

Must Read20 Views 20 Likes

Industry News - Management Industry News- Criminal Justice

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

This Week (June 17- June 23)

Name

Email Address

Submit

Area of Interest

Get Latest Industry News Delivered to Your Inbox

Blog Title

Blog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

TwitterShare Linkedin

Read Later

Read Now

Footer

See WhatYou Missed 2014 April March February

Make This Your Default Blog View?

You wont have to choose categories again. You can switch back to other categories anytime from the top navigation bar.

Yes Remind May Be Later

Powered by Univeristy of Phoenix

May

Sticky nav

Cookie enabled likes. Don’t require signing in

Content arranged in a time recent manner

User enters an email address and article can be emailed or could possibly use ‘Evernote’ type apps

Goes to article view

Rolls out from right

EDUCATION AND CAREER PLANNING

More on Industry News NextPrevious

15 mins Read

Blog Title

Must Read20 Views 20 Likes

Meet Alicia: How she planned her career

15 mins Read

Blog Title

Popular20 Views 20 Likes

Nursing Industry News Career Pl..

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

15 mins Read

Blog Title

Popular20 Views 20 Likes

15 mins Read

Blog Title

Must Read20 Views 20 Likes

How to Plan a Career in Management Career Planning- Criminal Justice

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

This Week (June 17- June 23)

Blog Title

Blog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

TwitterShare Linkedin

Read Later

Read Now

Cookie enabled likes. Don’t require signing in

Content arranged in a time recent manner

User enters an email address and article can be emailed or could possibly use ‘Evernote’ type apps

Goes to article view

More on Career and Education Planning NextPrevious

THE PHOENIX EXPERIENCE

15 mins Read

Blog Title

Must Read20 Views 20 Likes

Meet Alicia: Nursing from Phoenix

15 mins Read

Blog Title

Popular20 Views 20 Likes

Nursing Industry News Career Pl..

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

15 mins Read

Blog Title

Popular20 Views 20 Likes

15 mins Read

Blog Title

Must Read20 Views 20 Likes

Learning at Phoenix Phoenix Experience- Criminal Justice

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

This Week (June 17- June 23)

Blog Title

Blog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary BlogBlog Summary Blog Summary Blog

TwitterShare Linkedin

Read Later

Read Now

Cookie enabled likes. Don’t require signing in

Content arranged in a time recent manner

User enters an email address and article can be emailed or could possibly use ‘Evernote’ type apps

Goes to article view

More on Phoenix Experience NextPrevious

Page 22: Designing UX for a Content Blog

Submit

Area of Interest

XEnter Information

Email Address

Get Latest Industry News Delivered to Your Inbox

CATEGORY: NURSING

CURRENT INDUSTRY NEWS EDUCATION AND CAREER PLANNING

This Week (June 17- June 23)

15 mins Read

Blog Title

Must Read20 Views 20 Likes

Nursing- Current Industry News

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

Blog Title

Must Read20 Views 20 Likes

Nursing- Current Industry News

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

15 mins Read

Blog Title

Must Read20 Views 20 Likes

Nursing- Current Industry News

Blog Summary Blog Summary BlogBlog Summary Blog Summary Blog

8 mins

Past Week, June 10th - June 16th

Make ‘Nursing’ Your Default Blog View?

You wont have to choose categories again. You can switch back to other categories anytime from the top navigation bar.

Yes May Be Later

Footer

Make ‘Nursing’ Your Default Blog View?

You wont have to choose categories again. You can switch back to other categories anytime from the top navigation bar.

Yes May Be Later

Powered by Univeristy of Phoenix

Horizontal Swipe

Cookie enabled like. Don’t require signing in

15 mins Read

Blog Title

20 Views

20 Likes

May, 2014

Must Read

15 mins Read

Blog Title

20 Views

20 Likes

Must Read

15 mins Read

Blog Title

20 Views

20 Likes

Must Read

15 mins Read

Blog Title

20 Views

20 Likes

Must Read

NextPrevious

VIEW ALL

Page 23: Designing UX for a Content Blog

Final Visual Designs !Responsive (Mobile/Tablet/Desktop)

Company Confidential

Page 24: Designing UX for a Content Blog
Page 25: Designing UX for a Content Blog
Page 26: Designing UX for a Content Blog
Page 27: Designing UX for a Content Blog
Page 28: Designing UX for a Content Blog

Appendix Topics-!Industry Examples &!Market Research!

Company Confidential

Page 29: Designing UX for a Content Blog

Company Confidential

INDUSTRY EXAMPLES

Successful Content driven sites !!!

Company Confidential

- Engaging and useful to consumers (first) and Brand driven (second, subtle)

Page 30: Designing UX for a Content Blog

Company Confidential

- Balance of Visual + Written

Company Confidential

Page 31: Designing UX for a Content Blog

Company Confidential

!

Interactions/ Reviews/ Recommendations/ Live voting

Company Confidential

Page 32: Designing UX for a Content Blog

Company Confidential

!

Clear content categories, Easy to find specific areas of interest

Company Confidential

Page 33: Designing UX for a Content Blog

Company Confidential

!!

- Storytelling driven

Company Confidential

Page 34: Designing UX for a Content Blog

Company Confidential

Company Confidential

Brainpickings Content

Page 35: Designing UX for a Content Blog

Company Confidential

!

Author is KEY. Celebrate the author. Author identity with individual profile pics.

Page 36: Designing UX for a Content Blog

Company Confidential

!

Author is KEY. Celebrate the author. Author identity with individual profiles.

Page 37: Designing UX for a Content Blog

Company Confidential

Notifications on current content. Option to view with direct click.

Page 38: Designing UX for a Content Blog

Company Confidential

Reader interactions

Page 39: Designing UX for a Content Blog

Company Confidential

Easy social sharing

Page 40: Designing UX for a Content Blog

Company Confidential

Page 41: Designing UX for a Content Blog

Company Confidential

Other articles like this/ Similar

Page 42: Designing UX for a Content Blog

Company Confidential

Singular focus and tiered hierarchy (Ex: Huffington Post). One main focus with every refresh. Simple grid.

Page 43: Designing UX for a Content Blog

Company Confidential

Page 44: Designing UX for a Content Blog

Company Confidential

USA Today

Page 45: Designing UX for a Content Blog

Company Confidential

!

What type of reader are you? Type of content read. Provide user profile !

Page 46: Designing UX for a Content Blog

Thank You!

Company Confidential

“Ask me about the Agile Scrum projects I worked on.”