Cathy x Digital Adventures

User Experience Design, User Interface Design, Digital Media Marketing, Social Media and Community Engagement, Web Development, Brand / Product Management

[thisiscathychen]

Controlling Scope Creep

Document assumptions

1. Described what you are agreeing to very clearly

2. Budget analysis - extra features, extra time, extra cost

3.  For every similar instances, add an assumptions

4. Timeline - what can be done right now, what needs to wait for later

Creating a Realistic Project Scope

Game - “Buy a Feature”

[thisiscathychen]

Connecting Users with Strategy

Decision Path 

1. How much information does a user need to see before an action is taken?

2. How much interaction does the user need before an action is taken?

3.  How should it be organized or prioritized?

You have to iterate and generate requirements. It’s a process, not a solution.

Requirements ≠ Features

Features the solutions to requirements.

3 Types of requirements

1. Things that people say they need

2. Things that people actually need

3. Things that people do not know they need

Requirements need to be documented to manage expectations from users and stakeholders

+Decisions, task flow, and implementation should all be documented eg. XML, PDF shared files

Documentation eliminates excuses and surprises. 

[thisiscathychen]

Summer Reading 🕶

[thisiscathychen]

Identifying User Needs for UX Design

What designers / developers want - a site with lots of cool features.

What users want - a site that’s easy to use, which gets something done faster.

What clients want - a site that can attract more users, save $$, or make $$

Interviewing Clients

B2B

+Don’t ask about tools, ask about process

What constitutes a good workday for you?

How do you go about (specific task, end goals)?

How does this compare to other organizations?

B2C

+Open ended, don’t “lead”

Don’t be unnerved by silence from people, it’s an important process

What frustrates you the most about a site?

What do you do on this website, show me how do you do that?

What’s a similar site that does this?

What do you like about the site?

[thisiscathychen]

UX - What’s Worth Doing?

Importance v. Feasibility / Viability (Able to achieve / Able to sustain)

UX Designer’s role is to get everyone’s mental model on the same page  

-difficult to recover from derailment, differences in vision

Extensive, clear documentation is key to Lean and Agile UX practices: available and understandable to every player involved.

1. Identify target audience 2. What are compelling / valuable experiences for this audience? 3. Offering should have an edge, be distinctive from competitors (both direct and indirect competitors) 

No business has no competition!

+Unique visitor return rate is around 2%, it is a resource intensive investment

**First and foremost UX goal is to increase engagement from peripheral visitors and returning visitors

The UX Value Loop

Uncovering business objectives - make $$$ or save $$$?

regulation, preconception, and expectation of industries 

*Is it B2B or B2C?

[thisiscathychen]

A/B Testing

A/B Test

Call to Action (CTA)

Experiment

Control (or The Original)

Multivariate Test

[thisiscathychen]

Growth Hacking and User Acquisition

Growth funnel  

Acquisition (reaching out to the universe of customers ) → Activation (engaging in activity) → Retention (returning customer and referrals which starts the cycle back again)

creative tactics such as changing design of landing page, tweaking product design

Why Paid Acquisition?

*is a method to harvest existing demand, not to create demand

mature market, established competitors, people actively search for 

Incumbents v. Startups→incumbents have more resources (both monetary and infrastructural), however startups have more flexibility to experiment and capitalize on early adoption

Acquisition

Ads: audacious statement (want to argue with authority) and a “curiosity gap” that incites people to find out more→click bait

example subreddits as an advertising channel that incumbents who are more brand conscious cannot follow to, even though there’s an overwhelming amount of traffic on reddit.

site links on Google Adwords on all branded campaigns

→Use bigger companies to champion you / feature on front pages / editorial placement

Caveats in user interface that delights users.

Show your personality in a fun, playful way that can damage the “reputation” of larger companies→especially important for gaining a localized following

Brand storytelling as reflected in social media feed... something interesting and out of the ordinary to gain more followers.

Activation

cognitive load→people will always choose the easiest option given multiple choices

sheer amount of information that you give a user

more options gave customers more chances to second guess

lower cognitive load led to more success in intriguing users

+make the process by which a potential customer turns into a new customer as fast as possible

Retention

Be easy to share

Does your user’s experience with the product improve with inviting more people? (think about Facebook, Instagram, Linkedin, etc.)→perks of telling their friends about it. referral code.

example. Dropbox attributes 55% of their growth to their referral program where one user and their invited friend both get benefits from joining.

*be truly viral*

Make sharing your product your -primary channel of growth-

a way for people to dream of what they could do: catalog, “pins”, saves, etc. drives retention

opportunity for users to talk about the experience of using the product, even if not directly relevant to the product

examples. Google doodles on the search engine page

[thisiscathychen]

Cultivating Online Community

Understand who your business serves

1. differentiate and prioritize different audience: employees, stakeholders, business partners → translate to customer

2. profile customers: audience segmentation, audience listening + discovery

3. channels for customers and prospective customers (where are they spending the most time, where the most conversations are happening)

4. what kind of content is most responsive for customers?

5. what topics / hashtags are trending 

TOOLS: twitturly, social mention, trendistic

6. SEO / SEM / Email Marketing → also auxiliary geo-based and traditional marketing materials i.e. flyers, free magazines, etc.

ENGAGE IN SEED CONVERSATION

Whether or not target audience is going to “follow” you - have you added content with value for your target communities? Have you established yourself as a trustworthy source of information? If you are going to “own a piece of the conversation” or “re-direct users to a different place” the answers to these questions must be YES.

7. PLATFORM - host content and information / CHANNEL - distribution / ASSETS - content that can seed conversation and build a following / MEDIUM - brand identity, visual design, photo, video, etc.

8. CONTENT - original or from other sources +how much bandwidth, how resource intensive / finding a balance

9. Brand and messaging guidelines →MESSAGE TRIANGLE - three points that can come across any conversation relating to the business, company, org.

10. Community Management playbook → day-to-day scenario of how to deal with both positive and negative feedback. Save examples of how to mitigate negative comments and feedback as well as how to capitalize on positive feedback and comments.

11. Note in “listening and discovery” exercises what has worked really well for past campaigns... what has worked well for your competitors?

12. Once you built audience conversation, be sure to make it an interactive experience (coupon codes, email collection with a quick Y/N question, advertising that is visually memorable and consistent)

[thisiscathychen]

#workstation #hooked @nireyal #reading #studying #ux #ui #apple #gooddesign #strategy #marketing #branding #fabrication #prototype #product #opendesk #cafe #table #fablabep (at Fab Lab El Paso)

[thisiscathychen]

Rendering of 360 3D Scanned Portrait by Sketchfab / Structure Sensor SDK

cathy by fablabep on Sketchfab

[thisiscathychen]

Thanks to @setupinspiration for the feature! #minimalist #workstation #ux #ui #inspiration #interiordesign #digital #tech #design http://ift.tt/2afXxv0

[thisiscathychen]

Rapid Prototyping for Digital Product

+Content FIRST

+What is the main outline of what your content is going to look like?

+Hierarchies of pages

+Content strategy is king, content is the bread and butter not the visual design ultimately

User Experience Feedback

+Thinking about target audience, understanding the users’ needs

+Lean UX Startup Method

+Emotional resonance with the site / usability / achieves goals

-PROS-

+communicate ideas quickly

+iterate in real-time

+reduce misinterpretation of functionality

Four Methods for Prototyping

1. Wireframe (flat documentation) - - becoming less desirable in the market

OMNIGRAFFLE high-fidelity view of the site

generates sitemap

2. TAP

3. Style Tiles / Mood Board

+styletil.es

3. Touch Application Prototyping

+iOS Keynote

+Keynotopia / prototype bundle / template files

4. HTML/CSS

5. Twitter Bootstrap

[thisiscathychen]

HTML, CSS, Javascript: Build a Robot for an Eccentric Millionaire using Code

+Don’t use HTML element names as class names to avoid confusion in stylings

+According to the default, normal flow of the web, everything you put on a webpage should sit flush on top of each other, in the very same order that they appear in the HTML.

+Positioning CSS in-depth with the idea of positioning what’s “in front of” and “behind”

+CSS transformations to flip and rotate elements

Simple robot CSS illustration

<!DOCTYPE html>

<head> <style> div {  height: 150px;  width: 300px;  margin: 0 auto; } .beep{  width: 5px;  height: 0px;  border: 5px solid transparent;  border-top: 10px solid #777;  border-bottom: 80px solid #888; } .brain {  background: radial-gradient(circle, white 15%, transparent 40%), #cc5;  background: -moz-radial-gradient(circle, white 15%, transparent 40%), #cc5;  background: -webkit-radial-gradient(circle, white 15%, transparent 40%), #cc5;  background-size: 75px 150px;  height: 150px;  width: 150px;  border-radius: 60px 60px 10px 10px;  border-bottom: 40px solid #666; } .torso {  height: 0;  width: 140px;  border-top: 300px solid #bc6;  border-left: 75px solid transparent;  border-right: 75px solid transparent;  border-radius: 20px 20px 100px 100px; } .foot {  height: 40px;  width: 40px;  background: #ccc;  border-radius: 40px;  border: 15px solid #999; } </style> </head>

<body> <div class="beep"></div> <div class="brain"></div> <div class="torso"></div> <div class="foot"></div> </body>

[thisiscathychen]

Fast, Lean UX Research

2. Card Sorting (between 10-20 people, 5 groups of 3, 30 minutes)

Example: developing a site / app

Name of the page / a sentence of what is in the page and what it’s for

Organize cards into logical groups and give the group a name

RESULTS

+Dendrogram (tree diagram)

+Terminology

+Relationships

+Missing features

PREPARATIONS

+Selecting content (current / future)

+Preparing the cards (<100, + empty, #)

+Selecting a tool

+Open or closed sort? / whether or not users come up with names for the sorting categories or use existing categories

+Individual or group sort? (groups of 3 sorting, optimized) - discussion / more point of view insight

+In-person or remote sort?

+incentives / begin recruiting as soon as possible!

HOW TO FIND USERS for EXPERIENCE SAMPLING?

+brief participants

+observe, take notes

+keep momentum going

+don’t lead the witness

+prompt quiet participants

ANALYZING DATA

+cluster analysis

+eyeball groupings

+unify group names

+analyze oral feedback

*group sessions are 45 minutes, takes 1-2 days, individual sessions are 30 minutes, analysis is almost immediate*

3. Usability Tests (A/B Testing)

+things to keep

+opportunities for improvement

+data about speed, success, and satisfaction

+missing features

+unforgettable quotes

PROCESS

+script

+brief

+warm-up questions

+tasks

+debrief

+logistics: incentive, room, observatory

+pilot

[thisiscathychen]

Fast, Learn UX Research

UX - how people feel when they use something

UX research - discipline that studies people, design, and how they interact with each other to achieve specific goals in different contexts

Lean startup - a set of processes used by entrepreneurs to develop products and markets 

+Agile Software Development

+Customer Development

Lean UX Research Techniques

1. Research Questions

+Define specifics of what you are after

+Epicenter of any research activity

+Core of a study plan, tighten the study script

+Prevent drifting to irrelevant areas

-GOALS v. QUESTIONS-

+How

+Artifacts

+Pain Points / Delights

+Opportunities for problem-solving

-WHERE DO RESEARCH QUESTIONS COME FROM?-

+UX study

+Team dilemmas

+Assumptions about people, users, and designs

examples 1. What do people need? 2. What is the right way to structure information and help people navigate through it? 3.What are good design aspects of a product and opportunities to improve?

DON’T LISTEN TO USERS, OBSERVE BEHAVIOR

*key difference between market research v. UX research*

A/B testing

Q: How to move people from home page to product page?

Q: What features should be built first?

1. Experience sampling

-a strategic research technique for uncovering user needs-

+Research participants are interrupted several times a day to note their experience in real time

POTENTIAL RESULTS

+Insights about user needs

+Ideas for useful product features

+Current pain points and delights 

+Data about experience categories

PROCESS

-think about the question, how long? how many alerts?- 

alert should be <1 minute, choose medium SMS, email, app, phone

-decide how to collect data-     -plan analysis-

+participants (how many? usually 60+), set expectations, practice, incentivize, begin recruiting

+launch and track

+adjust participant behavior, clarify (what are good answers?)

+reward participants (tell them they are doing well)

+begin analysis early

DATA ANALYSIS

+clean up data

+decide on categories, classify

+adjust categories

+analyze as a team first (first 15 responses), then individually (split work)

+eyeball data

+generate frequency charts, identify themes (study / visualize statistics)

*potentially take 3-5 days end--end, depending on availability of participants

BOOK: “Quantifying the User Experience”

[thisiscathychen]

UX Design: Positioning Content

“right content, in front of right users, at the right time”

user’s relationship with product and service and mapping out points - creating human experiences with products and brands

+business strategy +interaction design +usability analysis +user research +content strategy +information architecture

-Information Architecture-

+experience is fluid

+structures/infrastructures for information

Why is IA / UX important?

+to communicate information relationships with a designer, developer, and others

TOOLS: Excel

1. Audit

+What information needs to be included?

-survey / interview customers (or potential customers) “personas” (6-9 users, not more than 15 users)

-competitive analysis of sites, catalogue features, texts, images

target audience, content

2. Inventory

+catalogue content based on user research

USER TASKS (what the customers want to see/do)  - - - INFORMATION REQUIREMENTS (how to deliver this information/feature to the customer)

3. Prioritize

+rate user tasks (high, medium low) for target users

-and also rate potential customer based on how much they are meeting business goals-

+rate business needs (mission, end goals both short and long-term)

+calculate total to see which features need to get prime real estate on UI

4. Group Items

+group by priority and related items

5. Placing Content

+site maps

-list of every part of a website- / structure and where everything “lives”

+content hierarchy (high level)

The F-pattern, eye-tracking head map to see where people are looking

*stand-alone content (e.g. image contrasting with text) and columned content (e.g. widgets) receives extra attention*

start with “main content” and “supporting content”

+content design (featured level)

+navigation patterns -pattern libraries- (yahoo.com)

+leaderboard

**this is not the time to be creative, the UX designer’s job is to deliver to the visual designer the hierarchy of information and the content flow based on research**

next step is wireframes, usability tests, A/B testing...

[thisiscathychen]

Community Management Strategies

1. Invite Guest Writers *influencers*

-people who are leaders in their communities-

+understand underserved markets

+investment in guest writers, attracts their audience to your site

2. Interview influences

+”consistency bias”

+instantly ups credibility in establishing connection with certain communities

investment of time in content by people across multiple channels builds brand credibility and status

3. Host Contests

+hosting contests /compelling challenge and tie it to brand promotion/

+rewarding people in community for their involvement

4. Publish Case Studies

+storytelling / avoid pure self-promotion

+interviews with customers, value of what the brand has to offer from the perspective of C2C instead of B2C

5. Make a “Best of” List Post

+Let content producers know that they have been featured (via Twitter or email)

+ “Ego and reciprocity”, celebration of what other people have done well will reflect positively on the authenticity of the brand

*Unbounce: tool for A/B test*

6. Harness the Power of User-Generated Content (UGC)

+gamify community contribution, point systems build rewards into community engagement

+rule of “thumbs”

-link out / linking domains- strength of post evaluation

*customer reviews* increases the level of relevant content on the page (SEO)

moz.com and socialmediaexaminer.com

7. Timing of UGC

early on: + guest blog, interview, survey, twitter discussion

robust community: forums, dedicated UGC blog, regular guest writers / editors

+establish community house rules early on

8. Brand Ambassador (team value v. specific job responsibility)

+Natural affinity for socializing online

+Time

+Advocate for users

+Ready to take it offline

*MeetUp, Google Hangouts 

9. Reward Ambassadors! 

10. Leverage Feedback for Content

+expand upon topics in comments and discussions *READ THE COMMENTS*

-it could lead to a whole new post-

+case studies

+response to both positive and negative feedbacks (thanks or followup / apology)

+don’t sound “pitchy” or “self-serving”

-timeliness- is key don’t dig up old comments / respond within hours or a day

+don’t be afraid to take it offline for trolls, inappropriate comments

+CONTENT IS YOUR PRODUCT