All posts by Jennifer Blatz

Global Service Jam 2016

Global Service Jam Los Angeles logo

I am happy to report surviving another Global Service Jam. So what is global service jam? Is it some sort of cook off? Are you making jam? What does service have to do with it?

The Global Service Jam is a non-profit volunteer activity organized by an informal network of service design afficinados, who all share a common passion for growing the field of service design and customer experience.

Jennifer Blatz, UX Designer, attended Global Service Jam in Los Angeles.

The website goes on the say

As a participant in the Global service jam, you will work through a whole design process in one weekend. Whether you are experienced or completely new to the field, you won’t just be talking about service design, you will be working with others on developing concrete ideas and designs which could become real.

Furthermore:

  • You will learn more about a design-based approach to problems, and about sustainability.
  • You will pick up a load of new ideas and work practices.
  • You will meet a lot of cool people at all levels of experience.
  • Your work and ideas will be reviewed by your peers, and presented to the world, where they can be seen by potential customers or employers, or people who could make them real.
  • You will design something that may become a real business.
  • You might get rich and famous.
  • You will certainly have a blast.
Working on a storyboard with team members, Jennifer Blatz, UX Designer, attended Global Service Jam in Los Angeles.
Working on a storyboard with team members, Jennifer Blatz, UX Designer, attended Global Service Jam in Los Angeles.

And have a blast I did! It is exhilarating, exhausting, energizing and exciting. I get to participate in activities I don’t normally get to at work. I get to collaborate with complete strangers, who become friends through a weekend of intense team work. I get to flex some UX muscle, and keep skills sharp. I get to explore new ideas and learn about new skills like Service Design Blueprint and Business Modal Canvas. I know it might seem crazy to give up an entire weekend for an activity like this. But I think it is fun and I am always up for a challenge.

WIAD 2016

WIAD World Information Architecture Day Los Angeles 2016 attended by Jennifer Blatz, UX designerToday, I attended my third WIAD or World Information Architecture Day, established by IAI Information Architect Institute.  A couple of years ago, I acted as Project Manager for Los Angeles’ WIAD. So ai map to see that the torch has been carried and this event is back in the Los Angeles community. It’s a great opportunity to hear some of the industry’s well regarded IA experts, to meet other great people in the field, and hopefully to get fired up and inspired. What is WIAD? According to the website:

World Information Architecture Day 2016 is a one-day annual celebration of this phenomenon. Hosted in dozens of locations across the world by local organizers on February 20th, we focus on telling stories of information being architected by everyone from teachers to business owners; technologists to artists; designers to product managers.

With representation from all over the world, we believe that the power of similarity and the beauty of difference between stories will inspire those who work in information architecture, as well as those who may be new to it. We aim to teach, share, and have fun — all through the lens of Information Architecture (IA).

I would like to share some of my notes and highlights from today’s fabulous event.

  • If you’ve ever wondered where you are on a website, than that is an issue of IA.
  • An aspect of “play studio” is to pick a behavior and design for it.
  • Shift from a designer to a facilitator.
  • Research is becoming more collaborative.
  • Design work is not precious. So it’s good to work on low fidelity objects to keep that true.
  • Design work is not about ornamentation, it is about implmentation.
  • Think about creative solutions rather than what requirements are supposed to be delivered.
  • Designers need to be more collaborative and not worry about people (who are not designers) stepping on their toes and entering their “craft.”
  • Put the work out early to get user feedback, knowing it is an iterative process.
  • Try creating ad hoc personas when you don’ have time to create full-fledged personas.
  • Know your audience. This is so often forgotten. Keep in mind what your user’s current needs and behaviors are. Don’t lose site of who you are designing for.
  • Know when it is appropriate to work with an established design pattern and not reinvent the wheel.
  • Take the information you have gathered in research and shake things up when you need something different.

    WIAD World Information Architecture Day Los Angeles 2016 attended by Jennifer Blatz, UX designerWIAD World Information Architecture Day Los Angeles 2016 attended by Jennifer Blatz, UX designerWIAD World Information Architecture Day Los Angeles 2016 attended by Jennifer Blatz, UX designer
    WIAD World Information Architecture Day Los Angeles 2016.
  • Some corporations appreciate hiring people who will rock the boat and provide a diverse outlook to the company. Get hired to make a change in the corporate structure as well as the product that you will build.
  • Some companies will avoid innovation because of risk. This leads to fast following.
  • Tell the story | Develop the culture | Be the voice of the customer.
  • Innovation requires atriculation.
  • When you work on a design solution, what will people think, feel, do and become?
  • UX designers have great skills like: inter-discipline, like people, empathy and listen to others.
  • Think like a founder, not a designer.
  • Designers inherit problems, founders define them.
  • Design THE business, not for it.
  • Do you expect the world to anticipate your needs? Because you should.
  • The problem you have been given is not the right problem. Discover the right problem.
  • Every designer should have some skill in leadership.
  • What motivates a designer is a frustration with the world and a desire to improve it.
  • As a designer, you see something better.
  • Consider delivery mechanisms that extend your core experience.
  • Leverage what people love, address what they don’t.

WIAD 2016 attended by Jennifer Blatz, UX designer.

Complexity is not the problem
Ambiguity is
Simplicity does not solve ambiguity
Clarity does

UX Deliverables: Ethnographic observation

Jennifer Blatz UX design performs ethnographic research for the virtual travel sheet.
Understanding how users work in their natural environment will provide great insight in to your research.

Simply put, I love ethnographic research. I mean it when I say that this form of user research is probably the most valuable way to gain insight on your users and your product. And, unfortunately, it is far too often overlooked as time consuming or simply viewed as a waste of time. I could not disagree more!

First let’s define the term. According to Wikipedia, ethnography is:

 The systematic study of people and cultures. It is designed to explore cultural phenomena where the researcher observes society from the point of view of the subject of the study.

So how does this apply to UX and research? By observing your users in their natural habitat, you get exceedingly more information and context about their real world.

The benefits of ethnographic research for me include:

  • You see users use your product in a natural way, not in a fabricated lab setting
  • It provides context to their environment
  • You see things that you would never discover with a phone call or what the suer just tells you
  • You discover that what users say they do, and what they really do can often differ greatly
  • You see first hand the pain points that users are not aware that they have
  • You can observe true behaviors
  • You notice the environmental factors, like interruptions from c0-workers, slowness of equipment, and other physical attributes that affect the user
  • You have the opportunity to ask questions, on the spot, as circumstances arise
  • You can record aspects of the environment by taking photographs and video that could not be done remotely
  • You can establish a better rapport with your users
  • You can observe the entire context of the working environment, across rooms, buildings, people and other circumstances
  • It provides impromptu “bitch sessions” that the user would probably not normally share
  • It allows the user to feel like he/she is being heard
  • It allows you to be an “eye” for the other team members who are not able to view the user’s world
  • It gives the UX designer the best opportunity to really empathize with the user, by seeing how their work or life really is

Hopefully my reasons have given you enough understanding and reasoning to do your own ethnographic research. If you have your stories to share about ethnographic research, please do so in the comments.

 

UX Deliverables: Requirements

I am working on a project that enhancing the EMR (electronic medical records) where I work. We are creating a feature that will help doctors quickly build their medical plan and add items to the order (or list of items to charge the client). This feature, called a virtual travel sheet, will greatly increase the doctor’s satisfaction by making data entry easier, faster and will hopefully create a pleasant data entry experience with minimal typing. Doctors are familiar with the concept of a travel sheet. Many of them still use them in their hospitals to this day. Integrating a familiar paradigm in to the computer software used in the hospital should be greeted with delight.

What does a travel sheet look like? See the image below:
Jennifer Blatz UX Design travel sheet research for medical ERM project
Travel sheets may not be the prettiest thing to look at. But they have a strong function in the medical field when assessing patients.

I am writing the requirements and basic understanding of what the Virtual Travel Sheet (VTS) will do so that developers, QA, project managers and any other team players will understand the scope and expectations of the project. This is just a first draft.

Overview

The virtual travel sheet (VTS) will allow users to:

  • Easily enter items in to the plan without having to type in free text (so easy that it is preferable)
  • Easily enter items in to the plan without knowing any codes
  • Transfer/translate the items in my plan to an order
  • Transfer/translate the items in my plan to an estimate
  • See my plan built in real time
  • Create estimates (treatment plans) for items or services for the future
  • Include exams, vaccines, medications, injections, medical services, lab, imaging, etc.
  • Present items based on type of visit (outpatient, inpatient (hospitalized), boarding/grooming and retail products)
  • Filter out codes that don’t apply to the patient by species, age, weight, sex, altered status)
  • Present active, commonly used items (per hospital) as used per species
  • Allow for search
  • Ability to link to concerns
  • Display recent estimates for this patient

Typical users would be

  • Doctors writing their medical note
  • Technicians entering in items for the doctor in to his/her medical plan
  • Technicians entering in charges to the order

Access

  • Small tab to the right of the screen where user can “side open from left to right” the VTS.
  • This allows the user’s work not to be interrupted.
  • They can slide this open, and add items to today’s Medical plan or create an estimate.
  • All actions will be saved automatically.
  • The user can then just “slide” the window closed again and continue working on the lower/bottom/previous screen they were on before the opened the VTS.

Available travel sheets

  • Outpatient
  • Inpatient
  • Surgery
  • Medications
  • Specialty
  • Boarding & Grooming
  • Retail products

Filters applied to the VTS (can be turned off on the patient by the user)

  • Species
  • Sex
  • Age
  • Weight
  • Altered (y/n)
  • CareClub enrollment

The travel sheet will provide the user a condensed listing of codes based on

  • Filters that have automatically been applied
  • Available codes/catalog items for that hospital
  • Most commonly used codes by VCA
  • Most commonly used codes by that hospital
  • User favorites (second iteration)
  • Templates applied to plan

Personal milestone: 500 twitter followers

Jennifer Blatz UX Design has 500 followers on twitter

I am very excited to announce that I have reached a great milestone. I have accumulated 500+ followers on Twitter. I know that there are millions of other people that have a much, much larger number of supporters. I won’t attempt to compare myself to their accomplishments. But for little ol’ me, I am very please with having such a big number of followers.

I don’t tweet about what I am having for breakfast.

I don’t tweet about my political views of my favorite TV show.

I do tweet about UX design and digital trends. Considering that my niche is so very specific, I am very proud to have as many followers as I do. If you are interested in following me on Twitter too, please check out my Twitter account and start learning more about the UX world. Thank so much to all my followers. And thank you to those who I follow who provide such great content that I can “tweet forward.” It’s a great platform to learn from, and contribute to. Make Twitter work for you.

Design Space Vs. Solution Space

Jennifer Blatz UX Design user requests solutions to design problems
Users often request a “button” or other feature to solve what they think is the problem.

As UX designers, we have all heard our users or customers offer solutions to a problem.

  • “Can I have a back button at the top left?”
  • “Will you put these 4 item in the pull down too? I use them all of the time.”
  • “I’d love it if I could have a widget to help me build my plan in to a nice organized package.
  • “Can you put a button on the main page for me to easily access all of the uploaded files so I don’t have to click on the menu to go there?

Yes these might sound like good solutions on the surface. But it is more important to really find out what the user is having a problem with. That’s when you try to stay in the “Problem Space.”

The Problem Space is the portion of discovery where the UX designer really tries to understand the user’s problems. It’s good to hear the user out in this phase, even if he is proposing solutions to his problems. A good way to dig deeper, and to gain a better  understanding of the problem is to keep asking the user “Why?” This is know as the “5 Whys” technique and is often used by UX designers to discover more information. When a user gives you an answer, ask him “Why.” And ask “Why” again. And again. This way, he will divulge more information than he might be providing to you. Get deeper in to the problem. Try to get a better understanding of what he is struggling with, what his pain points are. Maybe, when more information is revealed, you as the UX designer will come up with a better solution that the user is proposing. That is the goal anyways. Maybe you will also discover that this user’s problem persists in other areas of your site or application. And a more universal solution would not only solve this user’s problem, but many other problems too.

Albert Einstein put it perfectly when he said:

“If I were given one hour to save the planet, I would spend 59 minutes defining the problem and one minute resolving it.”

It pays off to devote more time to analyzing the problem than quickly jumping to a solution. If you jump too quickly to a solution, without really understanding the problem, you might not actually be providing the best fix for the problem.

I understand that it is easy to quickly jump to the Solution Phase. Especially if a solution, which seems like a good idea, has been proposed. But by refraining from taking the leap, which requires patience and discipline, it gives you an opportunity to really define the problem. And this is crucial to success.

Remember that residing in the Problem Phase should not express any solutions. Just focus on a complete understanding of the problem before proposing any solutions. Also, clearly defining the problem, can help eliminate ambiguous terms that might be used and to get the entire team on board with the project.

UX deliverables and skills

Jennifer Blatz design UX and UI design clips and work samples

As part of my 2016 professional development, I’ve decided I am going to use my blog to showcase more of my UX skills. A tough decision any designer must make is to only show a select examples of my best UX work. I try to show my diversity of skills, as well as my breadth of design. So since I cannot show all of my clips in my portfolio, I am going to use my blog as my second clips stage.

Feel free to search the word “Showcase” for future examples of my UX work. But until then, examples of my work can still be viewed on my website www.jenniferblatzdesign.com.

Happy 2016 — Goal setting for the new year

2016 UX design resolutions for Jennifer Blatz

We are comfortably in the new year, 2016, and I am glad you have made the journey so far. I guess that people make goals for the new year huh? Here’s my to-do list:

Learn programs

  • Axure
  • Sketch

Improve coding skills

  • Learn javascript, at least the basics
  • Refresh my knowledge about CSS and HTML

Read books

  • “Information Architecture” aka the Polar Bear book
  • “Design of Everyday Things”
  • “Checklist Manifesto”
  • “How to Get People to do Stuff”

Keep learning

  • Start another “100 Days of Learning” journal, but expand it for the entire year
  • Review the “Learning Stuff” journal from last year

Write blog posts

  • I am shooting to post 30 blog posts in 2016

Join a side project

  • I would love to join another project. If you know of any short term projects that need a UX designer, please let me know.

Build out portfolio

  • Improve the content of my portfolio by introducing new clips
  • Present my acquired knowledge illustrating my software proficiency

Ok just 29 more blog posts for 2016. Thanks for reading.

Perfecting the elevator pitch

We’ve all been told to prepare one: the dreaded elevator pitch. Well what is it? According to Wikipedia, an Elevator Pitch is

An elevator pitchelevator speech or elevator statement is a short summary used to quickly and simply define a process, product, service, organization, or event and its value proposition.

The name ‘elevator pitch’ reflects the idea that it should be possible to deliver the summary in the time span of an elevator ride, or approximately thirty seconds to two minutes and is widely credited to Ilene Rosenzweig and Michael Caruso (while he was editor for Vanity Fair) for its origin. The term itself comes from a scenario of an accidental meeting with someone important in the elevator. If the conversation inside the elevator in those few seconds is interesting and value adding, the conversation will either continue after the elevator ride, or end in exchange of business cards or a scheduled meeting.

While in the process of tweaking my resume, I thought that my summary sentence needed a bit of work. I wanted my summary to be more UX focus, rather than highlighting my design history. Do you have any thoughts?

Old Summary

Building on a strong foundation in journalism, design and graphics, my skills in visual communication encompasses all disciplines including User Experience UX Design, Interaction Design and Art Direction.

New Summary

A User Experience Designer utilizing design thinking, analysis and research to create software, products and digital experiences that are aesthetically pleasing and easier to use.

Granted, this is a bit verbose if I was summarizing what I do in a quick 30 seconds. But I wanted to present something that packed a powerful, descriptive punch. It certainly is shorter than my original summary. And it focuses more on UX design, which I was advised that my resume needed to portray more. I think that the new Pitch accomplishes that task. But if you have any feedback on how it could be improved, please don’t hesitate to comment and share your thoughts.

 

Wrapping up 2015 with 100 Days+ of learning

100 days of learning UX design notebook Jennifer Blatz

As you know from my previous post, “100 Days of Learning Stuff,” I set up a challenge for myself to learn something new every day for 100 consistent days. My goal was a success, and I continued the learning experience through the rest of the year.

Looking back at my book today, I am pleased with myself for taking a bit of time to take note and learn a few things along this year’s journey. Some of the topics included in my UX journal include:

  • Several “Golden Rules” lists for UX
  • Numerous definitions of key terms and concepts
  • Great UX quotes
  • Laws like Hick’s Law and Fitt’s Law
  • Principles and steps
  • Abbreviations and methods

And a lot more. I am going to set a goal to create a new UX notebook for 2016. I encourage you to develop a journaling method for yourself and keep on learning in the New Year.

I hope 2015 was great for you. And best of luck in 2016.

Prototyping tips: What you should know after a session

User Testing recently published a handy guide on prototyping called “Getting out of the office: Testing mobile app prototypes with user”.

Here are a few pointers of what you should know after prototyping your project.

When you’re finished testing at this stage, you should be able to answer these questions to validate your concept before moving forward to a higher fidelity prototype:

  1. What problem does your idea solve?
  2. How are users solving this problem currently?
  3. Can your target market think of another product that does something similar?
  4. How have previous solutions failed?
  5. Do users understand what this product or service does?
  6. How do users feel about the product or service?
  7. Who is your competition?
  8. What is the app for? What can users do with it?
  9. Does your target market actually have a need for this product?
  10. What devices do users imagine themselves using when they interact with this product?
  11. What scenarios can they picture themselves using it in?

Continuing education

Interaction Design Course participants
Interaction Design Course participants

As professionals, we always need to be learning. The times have passed that we can just coast through our careers.

I recently attended an Interaction Course presented by CooperU in Los Angeles. They are often offering classes only at their facility in San Francisco. So I was excited to attend this workshop and to learn to new skills.

What did I like the most?
  • Getting some time off of work
  • Engaging in new activities
  • Jump starting the brain and creative processes
  • Meeting new people

What did I dislike the most?

  • It only lasting 3 days. I could have learned more.
  • Some exercises seemed too “on the surface” and I would have liked to have the chance to dig deeper or try the exercise again on a different topic for more practice.
  • It seemed very “Cooper” focused and I am not sure there would be time to apply some of these tactics in the real-world agile environment.

What surprised me the most?

  • How quickly the time would fly by in the breakout session.
  • People were other disciplines besides UX design.
  • Lunch was not provided as part of the admission fee. (It would have been a good opportunity to have break out sessions on other topics.
  • How exhausted mentally I was by the end of the third day. I guess I was really giving my brain a workout.

Don’t waste a moment. Take advantage and learn.

Jennifer Blatz UX design always learning
Even on casual encounters, like an Uber right home, take advantage of meeting a new person and learn something.

When riding home one evening in the back of an Uber car, I took advantage of a situation. Sure, I could have sit back quietly and enjoyed the ride in silence. The driver did not have the radio on, so it could have been a peaceful ride.

Instead, I decide to make the ride a bit more interesting. Don’t worry, I was not going to engage in anything illegal. I decided to engage the driver in a conversation. Gasp! Talk to a stranger in Los Angeles? What? Who does that??? Well, I do.

You see, I am a gal from the Midwest. People from that part of the world are not afraid to engage in a conversation. In fact, this art form was eloquently taught to me by my father. I can recall on several instances the following circumstance: I am in a long line for an amusement park ride. My dad is waiting for me outside the ride on a bench until I am finished. By the time I get back from the ride, my dad has had a long chat with the person sitting next to him on that bench. I didn’t even notice the person when I started to get on the ride.

So what was happening here? My dad was a very smart man, and knew that having a conversation would help pass the waiting time. He didn’t want to read a book because he liked to people watch. These were the days before smart phones. So he wold strike up a chat with a complete stranger.

Not only did a conversation like this pass the time, he also learned something. And that is what I am trying to promote here. Instead of looking down and checking your smart phone, strike up a conversation with a stranger. What was so magical about the conversations my dad would have with strangers is what he learned about the other person. He would say things like, “That guy lived just a couple of blocks down from where I grew up in New York. And our parents when to the same social hall for dances and parties.” Or he would say, “The lady I sent next to on my flight is the inventor of body glitter.”

What do you do to learn more? Just start a conversation. I know this is not easy for some people. Striking up a conversation with a complete stranger can be terrifying. But if you want to be a UX designer, you have to break out of your shell and learn how to be comfortable in a conversation with others. It’s ok, the (probably) won’t bite.

  • Start the conversation small, maybe make a comment about the weather or the current surroundings.
  • Or ask a generic question about something you “seem like” you need assistance with like the time the the store is closing or do they if know….
  • Maybe you can make a comment out the phone they are looking at. Ask, “Oh is that the new iPhone? Do you like it?” People love to talk about their gadgets.
  • Gage the person’s reaction, if they give you a short answer, they might not want to chat. See how negative they seem.
  • If they ask you a question back, it’s a good sign they might want to have a conversation.
  • If a person is reading a book or has earphones on, this is a sign  they might not want to talk to you. But if they are just gazing at their phone, they are probably just killing time.
  • Don’t get too personal. But it’s ok to ask what they do for a living and what they do in that type of job.
  • Just remember that people love talking about themselves, and the point of this exercise is to learn, so let the person do a majority of the talking.
  • Be brave, learn to read others and be safe.
  • But most importantly have fun and embrace the opportunity to learn from every experience.

 

User Interface Elements

  • Dropdown list vs. listbox
  • Buttons vs. radio buttons

Sometimes you just forget what each UI term really is called. And it’s good to have the terminology correct, especially when you are talking with stakeholders.

Usability.gov is a great resource when you want to quickly remember the names of those pesky UI elements.

User Interface Elements

When designing your interface, try to be consistent and predictable in your choice of interface elements. Whether they are aware of it or not, users have become familiar with elements acting in a certain way, so choosing to adopt those elements when appropriate will help with task completion, efficiency, and satisfaction.

Interface elements include but are not limited to:

  • Input Controls: checkboxes, radio buttons, dropdown lists, list boxes, buttons, toggles, text fields, date field
  • Navigational Components: breadcrumb, slider, search field, pagination, slider, tags, icons
  • Informational Components: tooltips, icons, progress bar, notifications, message boxes, modal windows
  • Containers: accordion

Input Controls

Description Examples
Checkboxes

Checkboxes allow the user to select one or more options from a set.  It is usually best to present checkboxes in a vertical list. More than one column is acceptable as well if the list is long enough that it might require scrolling or if comparison of terms might be necessary.

Example of checkboxes
Radio buttons

Radio buttons are used to allow users to select one item at a time.

Example of radio buttons
Dropdown lists

Dropdown lists allow users to select one item at a time, similarly to radio buttons, but are more compact allowing you to save space. Consider adding text to the field, such as ‘Select one’ to help the user recognize the necessary action.

Example of a dropdown
List boxes

List boxes, like checkboxes, allow users to select a multiple items at a time,but are more compact and can support a longer list of options if needed.

Example of a list box
Buttons

A button indicates an action upon touch and is typically labeled using text, an icon, or both.

Example of buttons
Dropdown Button

The dropdown button consists of a button that when clicked displays a drop-down list of mutually exclusive items.

Example of dropdown button
Toggles

A toggle button allows the user to change a setting between two states. They are most effective when the on/off states are visually distinct.

Example of toggles
Text fields

Text fields allow users to enter text.  It can allow either a single line or multiple lines of text.

Example of text field
Date and time pickers

A date picker allows users to select a date and/or time.  By using the picker, the information is consistently formatted and input into the system.

Examples of date and time pickers

Navigational Components

Description Examples
Search Field

A search box allows users to enter a keyword or phrase (query) and submit it to search the index with the intention of getting back the most relevant results. Typically search fields are single-line text boxes and are often accompanied by a search button.

Example of search boxes with various functions
Breadcrumb

Breadcrumbs allow users to identify their current location within the system by providing a clickable trail of proceeding pages to navigate by.

Example of breadcrumb
Pagination

Pagination divides content up between pages, and allows users to skip between pages or go in order through the content.

Examples of pagination
Tags

Tags allow users to find content in the same category.  Some tagging systems also allow users to apply their own tags to content by entering them into the system.

Example of tags
Sliders

A slider, also known as a track bar, allows users to set or adjust a value.  When the user changes the value, it does not change the format of the interface or other info on the screen.

Example of sliders
Icons

An icon is a simplified image serving as an intuitive symbol that is used to help users to navigate the system.  Typically, icons are hyperlinked.

Examples of icons
Image Carousel

Image carousels allow users to browse through a set of items and make a selection of one if they so choose. Typically, the images are hyperlinked.

Example of an image carousel

Information Components

Description Examples
Notifications

A notification is an update message that announces something new for the user to see. Notifications are typically used to indicate items such as, the successful completion of a task, or an error or warning message.

Example of a notification
Progress Bars

A progress bar indicates where a user is as they advance through a series of steps in a process. Typically, progress bars are not clickable.

Examples of progress bars
Tool Tips

A tooltip allows a user to see hints when they hover over an item indicating the name or purpose of the item.

Examples of tool tips
Message Boxes

A message box is a small window that provides information to users and requires them to take an action before they can move forward.

Example of message boxes
Modal Window (pop-up)

A modal window requires users to interact with it in some way before they can return to the system.

Example of a modal window

Containers

 

Description Examples
Accordion

An accordion is a vertically stacked list of items that utilizes show/ hide functionality.  When a label is clicked, it expands the section showing the content within. There can have one or more items showing at a time and may have default states that reveal one or more sections without the user clicking

Example of an accordion

Checklist for Designing Mobile Input Fields

The Nielsen/Norman group recently published Checklist for Designing Mobile Input Fields featuring a quick reference of what you should review when designing for mobile.

A Checklist for Designing Mobile Input Fields via Jennifer Blatz UX design
Credit Nielsen Norman Group

 

 

 

Text version of checklist of 14 guidelines to follow for mobile input field UX

Should it be there at all

  • Is this field absolutely necessary?

Description

  • Is the label above it? (Not inside, not below)
  • Is the field marked as required (*) or optional?
  • Have you removed any placeholder from inside the field?

Visibility

  • Is the field big enough so that most possible field values are visible?
  • Is the field visible in both orientations when the keyboard is displayed?

Filling it in for the user

  • Do you have any good defaults for this field?
  • Any history available?
  • Frequently used values?
  • Can you use the phone features (camera, GPS, voice, contacts ) to populate it?
  • Can you compute it for the user based on other info (e.g., state based on zip code, coupon field)?

Typing

  • Do you support copy & paste into the field?
  • What is the right keyboard for this field?
  • Can you make suggestions/autocomplete based on the first letters typed?
  • Do not autocorrect for names, addresses and email addresses.
  • Do you allow typos or abbreviations?
  • Do you allow users to enter it in whatever format they like? (e.g., phone numbers credit cards)
  • You can autoformat it for them.

User research: measuring information

User research measuring quantity vs. quality Jennifer Blatz UX design
Author/Copyright holder: Nielsen Norman Group.

When conducting user research, there are a variety of methods to acquire valuable data. This chart, courtesy of the Nielson Norman Group, illustrates the ranges that your research can measure.

Let’s break this down to the extreme ranges of this chart.

Behavioral

Ethnographic research is a fine example of behavioral research. This is where the researcher goes in to the user’s natural environment and observes the user in the user’s normal and regular context.

Attitudinal

Surveys and Interviews are some ways to see what the user says they would or would not do something. Often users will give answers they think the research wants to hear or what they think is the “correct” answer. The key here is that the user might actually believe what they are saying is true. But in fact, when the researcher actually observes the behavior, what the user has said might not be accurate.

Qualitative

One-on-one interviews and ethnographic research are a couple of great ways to get qualitative research information. The researcher can devote individual time to the user, and really get deep information about them. This takes time, and therefore can be difficult to accomplish in mass quantities. But submersing yourself in the users world will provide much more in-depth information than more quantitative research methods.

Quantitative

Surveys accomplish quantitative research very well. Especially with the plethora of online survey tools (many of them are free), one can easily send out a survey to hundreds, if not thousands of participants and gather a large amount of data. This data can then be accumulated to show trends, make charts and post results of several people. However, this research method does not provide individual insight and appreciation that a more qualitative research will provide.

All in all, there are many research methods that a UX researcher has at his or her disposal. They key is to know which research method is best for the type of information he or she is seeking. Also, many of research methods fall within the middle ranges of this chart, and not at the extremes. I encourage you to use a variety of research methods in your next UX project.

 

Real world vs. electronic world

Designing a paper EMR in to a digital format Jennifer Blatz UX Design
Creating an electronic version of a paper medical record is very challenging for the UI designer.

A UX/UI designer has a tremendous challenge when she is assigned the duties of translating a real-world process in to an electronic or digital process. The UX designer must keep the user’s mental model in mind when designing an electronic system.

When working on EMR, or electronic medical records, it is a completely different set up and system than the paper recording method the user has been using. They key to designing a successful EMR, is to closely match the work flow and system that the user is used to. That success has not really been achieved in most EMR systems. Often, software designers get too excited and caught up in the features and flash of digital possibilities. When working on any electronic system, it is crucial to always understand how the user works, and make your system as similar to that work flow as possible.

If you have any suggestions on how to bridge the gap between the real world and electronic world, please leave them in the comments. Thanks!

UX Advice: Do as I say, not as I do

Assorted wisdom for students of UX

I thought this article was very interesting. There are some great points of advice here. And since I could not write this better myself, I thought I would just share Dan Brown’s article in full.

Do as I say, not as I do: Assorted wisdom for students of UX

Summary of sections included in the article

  • Pick a job based on the people
  • Have a life
  • Accept imposter syndrome
  • Accept that design isn’t just design
  • Get great at writing
  • Pay it forward
  • Understand product development
  • Know thyself, but don’t pigeon-hole thyself

Gather user feedback: There’s more than one way (to skin a cat)

For all P.C. (politically correct) purposes, I am not promoting skinning a cat. I work for a veterinary company, I am certainly not going to condone harming animals in any way.

Designing a text messaging app within enterprise software should be tested by the users. Jennifer Blatz UX UI Design.
Getting user feedback by using a visual representation of your UI design is a great step in the design process.

But the headline did get your attention. ha ha

For the feature I am currently designing, pictured above, I used a variety of research methods to gather user feedback.

  • Interview users about how they use the smartphone app.
  • Observe users on how they operate the smarphone app.
  • Mock up an interface, and ask users questions about the design.
  • Create a clickable prototype to see if users understand how to operate the feature.
  • Observe QA to see technical of UI issues that arise in testing environment.
  • Be prepared to iterate once the feature has been released to make improvements.

User feedback is key. Don’t design in a bubble and assume you understand your user’s mental model. After talking to several users, and observing their behavior, I learned a lot of the assumptions I had were wrong. So talking to users early helped me to build a better product early, before it got too far in to the code. I encourage you to always run your design ideas by at least one person, very early in the process.

Community Coalition’s website relaunch

Jennifer Blatz UX design community coalition website redesignAfter nearly a year on the project, Community Coalition has launched the new design for their website. I am happy that I had the opportunity to participate in this process. Despite the longer than expected timeline to complete the project, I gained valuable experience and learned a lot of things on my journey as the team’s UX and graphic designer.

Lessons learned
  • People come from different backgrounds and have different experience to bring to the table. Take advantage of this diversity.
  • When working with people, things can take longer than expected. But…
  • Be patient and enjoy the ride.
  • The organization knows their users best, or at least assume that they do, so trust what they tell you.
  • Be empathetic, even if you don’t think you can completely relate to the user.
  • Working together helps the overall understanding.
UX deliverables created
  • Wireframes
  • Personas
  • Interviewing stakeholders
  • Competitive analysis
  • High fidelity mockups
  • Process and user flows
  • Content inventory, analysis and strategy
  • Information architecture and taxonomy
Takeaways
  • You get out of it what you put in. If you put in more, you can get very valuable assets.
  • Be willing to learn from others. You learn more by keeping your ears open and mouth shut.
  • Keep technology in mind. Not all users are on a high speed device with quick internet access.
  • Do you best to get the organization to clean up items that are not being used on the site. Analytics is a great tool to validate this cause.
  • Try to tell the organization’s story. The more you learn about them, the easier this is to do.
  • Have fun and enjoy giving back to the community.

 

Prototyping canvas explanation

This graphic is part of the Prototyping class I am taking offered for FREE at iversity.com. I find this simple chart, that a person would fill out, is a good exercise in really getting your thoughts out on paper. I am finding that it is helpful to actually get the idea out of your head, and force yourself to get the ideas out on paper. And it is great to really push yourself to come up with more than one idea. Go for it! And use the chart below to explore the reasons and products you will need for your next prototype.

Frank Kloos: prototyping canvas explanation

Prototyping canvas worksheet Jennifer Blatz UX design

Mission accomplished: 100 days of learning stuff

100 days of learning UX design notebook Jennifer BlatzI have learned a lot in the past 100 days

  • First, I learned that it is very difficult to write one entry on exactly every single day. So yes I did cheat a bit and write more than one entry a day to play catch-up on days that I missed. Don’t kill me.
  • Second, though many of the principles I was already familiar with, it was good for me to write them down and work harder at committing them to memory and learning.
  • Third, its rather nice to have all of these little lessons, from lists, the definitions to UX quotes all in one small UX journal.
  • Finally, now that my experimental deadline has been successfully met, I plan on continuing to full out my UX journal of learning. My notebook is less than half full, so there are plenty of other pages I can fill with valuable UX lessons and content.

Let the learning continue!

 

Journey map to understand the flow

Customer journey map, user flow, Jennifer Blatz UX Design
Understanding how the user will go through a process makes for a better design.

When a UI designer is assigned a new feature to build, it is crucial that you understand this process from the user’s point of view. You might think, “Oh I know all the steps the user will go through. I have it all in my head.”

Well I am here to tell you probably don’t have all of the steps the user might go through in your head. This is the advantage of creating a Journey Map. Call it what you will:

  • Journey map
  • User flow
  • Flow chart
  • Task flow
  • Customer journey map
  • Experience map

To me all of these terms are very similar. Yes I know I am bastardizing these terms by clumping them all together as one item. I understand there are difference in these terms and when they should be used. However, the point I want to make is just think about how the user will go through the process and make some sort of illustration to show these steps. You don’t have to use some fancy software like InDesign or Omnigraffle. Go completely low fidelity and just sketch it out on pencil and paper.

There are benefits of sketching the user flow on to paper and get it out of your head:

  • You think you have thought of all of the options. Well you have not.
  • You will discover unknown unknowns.
  • You might leave out a step when it’s left in your head. Drawing each step really fleshes out the process.
  • There will be additional avenues you have not considered that only sketching will bring to the surface.
  • It forces you to visually consider the options and how many additional steps those option might provide.
  • It illustrates how complicated a user flow can get. It’s often more detailed than we thought.
  • As with all sketches, it provides a great communication tool that you can then show to your team to continue the discussion.

So before you start designing any software, or mocking up any of your fancy ideas in Photoshop of Sketch, take a few moments do perform this crucial step of creating a  Journey map / User flow / Flow chart / Task flow / Customer journey map / Experience map. It’s a great idea to get any thought floating around in your head on to paper.

Card Sorting for the Enterprise Interface

 

Card sorting for enterprise software Jennifer Blatz UX Design
Card sorting is a process one can use to create an orderly system. It is being used here to organize a portion of medical enterprise software.

Card sorting can be used for much more than just organizing a website’s navigation. In fact, that is why information architecture is such a broad term. And one tool for helping people organizing and creating a structure is a card sort.

So what exactly is card sorting? According to the Wikipedia entry for card sorting: “Card sorting is a simple technique in user experience design where a group of subject experts or “users,” however inexperienced with design, are guided to generate a category tree or folksonomy. It is a useful approach for designing information architecture, workflows, menu structure, or web site navigation paths.”

Now that we know what it means, how do we use it? Or in other words, why do we use it? In my case, I wanted to test a few of the doctors who use my company’s enterprise software. We have a portion of the software that is Electronic Medical Records, aka EMR. I wanted to see how different participants thought the information should be structured in the patient’s EMR.

  • Should each entry be strictly entered chronologically?
  • And if that is the case, is the oldest entry first or newest entry first?
  • Should the most important information be surfaced to the top somehow?
  • Is there a way to create bundles of information or sub groups?
  • What does the user think the best way this information should be organized?

All of these questions could prompt hours and hours of discussion and speculation. So instead of endlessly talking about it, let’s get direct feedback from the users.

I know that many UX Designers use post-it notes on a wall to organize thoughts and create a taxonomy. However, what do you do if you don’t have a wall? And what if you do if your tester is not located in the same room as you? In other words, you need to perform the card sorting remotely.

I looked high and low for online and electronic resources to perform a card sort. I found that most of the online options were either too expensive or simply did not offer the functionality I was looking for. In the end, I settled on the free Mac program called XSort. This great little program (though visually very outdated) had the basic features I needed to perform a card sort. It allowed me to have more than 10 cards, it had the ability for the user to create subgroups within groups, and the cards would not automatically “snap” in to place like some services would. The users could place the cards wherever they wanted to on the screen.

So far, we have performed a few pilot tests with a handful of doctors to work out some bugs. The main lesson we are learning is that what the user is saying as he/she is going through the card sort is actually more valuable than the actual results. So instead of “throwing the test over the wall,” or in the online word, just sending out a card sort link and viewing the results, it is actually better to have the user talk you through their thought process. What is also valuable is that being able to moderate the card sort, and to answer technical or clarifying questions probably produces more accurate results. If a user is confused about a term or abbreviation, he or she might categorize that differently, and thus throwing off the card sort, than if the tester clearly understands the term. Finally one more valuable gem that I realized while performing cards sorts: Keep your mouth shut! Let the tester talk you through the awkward silences. If you must speak, ask probing and clarifying questions. But do your best to try not to suggest ANY way that a tester could group items. They tester will struggle at first. But that is OK. Just let them absorb all the cards and try to make sense out of them the best way that they can. You will get great user feedback if you actually let the user provide you that unbiased feedback.

The bottom line lesson here: Yes kids, card sorting can be used for more than just organizing navigation of a website. Try it out!

Researching new topics: Medical travel sheet

Travel sheet UX research and discovery by Jennifer Blatz
Master lists like this can help people remember conditions they might otherwise forget in a medical examination.

Travel sheets are a traditional medical document used by doctors as a sort of a check list of conditions. It’s a quick way to mark items that a patient may or may not have.

What do I know about medical exam travel sheets? Absolutely nothing! But that is a great start for any UX Designer. You don’t have to be an expert on your subject so start researching. In fact, the less you know can work to your advantage. Approaching a topic from a completely new and innocent perspective allows you to empathize how someone else who is new to the subject will be introduced. You have fresh eyes, less bias and a lack of knowledge to jump ahead of yourself.

So if you don’t know a lot about a topic then get started on learning. Use the web to research what others have said on the same topic. I don’t have to tell you the wealth of resources there are online. Also, talk to your stakeholders and clients to learn from they. they know their subject, and they should not be afraid to share this valuable information with you.

Jennifer Blatz UX Design travel sheet research for medical ERM project
Travel sheets may not be the prettiest thing to look at. But they have a strong function in the medical field when assessing patients.

Information architecture heuristics by Abby_the_IA

Abby Covert Information Architecture Heuristics

Findable – Able to be located

Is it Findable?  Can users easily locate that which they are seeking?  How is findability affected across channels and devices? Are there multiple ways available to access things? How do external and internal search engines “see” what is provided?  Is information formatted with results in mind?  What is provided to make the delivered results more useful?

Accessible – Easily approached and/or entered

Is it Accessible? Can it be used via all expected Be aware that upwards of 20% or more of the channels and devices?! worldʼs population has. How resilient and consistent is it a disability. when used via “other” channels?  The internet is a public place. Does it meet the levels of place. Itʼs like building a ramp to your building, or accessibility compliance to be refusing to be  considerate of those users with disabilities.

Clear – Easily perceptible

Is it Clear?  Is it easy to understand? Is the target demographicsʼ grade and reading level being considered? Is the path to task completion obvious and free of distraction? Would a user find it easy to describe?

TOP 3 Clarity Offenses

•  Corporate underpants: When you are obviously making a navigational decision based on your organizational structure, not user decision paths.

•  Inside Baseball: When you are calling something a term that is unclear to anyone that doesnʼt work for your company.

•  Weasel Words: When you are being purposefully unclear in language to avoid making a promise or decision about process or commitment to a user.

Communicative – Talkative. informing, timely

Is it communicative?  Is the status, location and permissions of the user obvious? How is messaging used throughout? Is messaging effective for the tasks and contexts being supported? Does the navigation and messaging help establish a sense of place that is consistent and orienting across channels, contexts and tasks?

Useful – Capable of producing the desired or intended result

Is it Useful?  Is it usable? Are users able to complete the tasks that they set out to without massive frustration or abandon?  Does it serve new users as well as loyal users in ways that satisfy their needs uniquely?  Are there a few navigation options that lead where users may want to go next? Are they clearly labeled?

Credible – Worthy of confidence, reliable

Is it Credible? Is the design appropriate to the context of use and audience? Is your content updated in a timely manner? Do you use restraint with promotional content?  Is it easy to contact a real person? Is it easy to verify your credentials?  Do you have help/support content where it is needed? Especially important when asking for sensitive personal data.

Controllable – Able to adjust to a requirement

Is it Controllable? Are tasks and information a user would reasonably want to accomplish available? How well are errors anticipated and eliminated? When errors do occur, how easily can a user recover? Are features offered to allow the user to tailor information or functionality to their context? Are exits and other important controls clearly marked?

Valuable– Of great use, service and importance

Is it Valuable? Is it desirable to the target user? Does it maintain conformity with expectations throughout the interaction across channels? Can a user easily describe the value? How is success being measured? Does it contribute to the bottom line? Does it improve customer satisfaction?

Learnable – To fix in the mind, in the memory

Is it Learnable? Can it be grasped quickly? What is offered to ease the more complicated processes? Is it memorable? Is it easy to recount? Does it behave consistently enough to be predictable?!

Delightful– Greatly pleasing

Is it Delightful? What are your differentiators from other similar experiences or competitors? What cross channel ties can be explored that delight?  How are user expectations not just met but exceeded? What are you providing that is unexpected? What can you take that is now ordinary and make extraordinary?

These heuristics are provided by @Abby_The_IA

You can view the IA Heuristics by Abby Covert Slideshare deck of the presentaiton.

Geek out with color on Cymbolism

What is Cymbolism?

Yes that is a good question. Cymbolism is a tool that attempts to quantify the association between colors and words, making it simple for designers to choose the best colors for the desired emotional effect.

Jennifer Blatz UX design plays with color voting website

Go to http://cymbolism.com and start to cast your vote. It is interesting to see how your interpretation of a term compares to what others think. For some I was in the majority, voting like most others. And for other words, I was completely off. No right or wrong answers here. Just have fun.

Creating Wireframes for Dashboard Development

Jennifer Blatz Design UX

 

Wireframes are not for everyone. I understand there might not be time to create wireframes. Some people don’t see the value of this middle step. “Just sketch out some ideas. Once you like something just code it up.” Others may not have it in the budget to create some deliverables.

Wireframes and deliverables by Jennifer Blatz UX
Wireframes can be created in a variety of programs. I chose Adobe Illustrator to create these first drafts of the dashboard.

I have to admit, I am guilty of not always creating wireframes. To me, they can be a luxury. There are times I don’t really have the time or the patience to go beyond sketches (if I have even created those) to going to the middle step of creating wireframes.

I strongly suggest that if you do have the time, and the budget, that you should make the effort to create some static wireframes. Here are a few advantages of creating wireframes:

  • Get the concepts out of your head and on to a page/layout
  • Visualize how your designs might work
  • Get early feedback on your designs before it goes in to code
  • Allow for quick changes before too committed to design
  • Facilitate discussion across the team and with stakeholders
  • Provides clarity for communication
  • For developers to understand the functionality of the site
  • To show the information architecture and navigation structure of websites
  • Cost-effective level of fidelity for quick changes
  • Print

100 days of learning stuff

Jennifer Blatz UX design 100 days of learning

I have taken on a new task. I am challenging myself to keep a little notebook of items I learn for 100 days. The toughest thing will be remembering to enter an item every day. I sure hope I don’t miss a day. But if I do, then I will force myself to carry one until I get all 100 days — or until my notebook gets full. Whichever happens first.  I encourage you to take the same challenge. Maybe it’s a notebook of doodles, or a notebook of learning a new word every day. Encourage yourself to take a moment every day to learn.

Personal milestone on Twitter: 300 followers

I am honored and humbled to say that I have reached a milestone for myself. I have earned the following of over 300 people. Now, I know that could fall back below 300 at any time. You know how it goes…. But I am going to enjoy the moment even if it doesn’t last forever.

Do you want to follow me too? I would be ever so delighted. You can join the fun at https://twitter.com/jnblatz. Come over and say “Hi.” Let’s have a conversation and maybe learn a bit from each other.

Jennifer Blatz has reached 300 followers on twitter @jnblatz
Sometimes small accomplishments can bring big joy to a person. Be proud of your accomplishments and keep on going.

300 Followers! Yay!! Thank you!!!

 

The Practical Psychology of Conversion

Jennifer Blatz Design UX color theory in buttons and design
Keeping in mind ideas about color theory can help you in your design.

I recently came across an article titled, “The Practical Psychology of Conversion” and I thought it had some great points to remember when designing a web page. Here are a few highlights.

In design and implementation of a call to action, everything from contrast, clickability and placement to directional cues affect buyer behavior.

Some of the recommended action copy to use to convert:

  • Get” something vs. “Buy” or “Download” or “submit”
    • one of my favorites: “Get the thing” (this was the button text to buy Louis C.K. tickets on his website)
  • Add to cart” vs. “Buy Now”
  • Start
  • Begin
  • Find
  • Become
  • Learn
  • Receive
  • Launch
  • Achieve
  • and of course, a healthy use of Free

In fact, the 5 most persuasive words in the English language are:

  • You
  • Free
  • Because
  • Instantly
  • New

 

Create UX Deliverables to Build up your Portfolio

There are many people trying to figure out how to make the jump in to the UX field. I too, not too long ago, was trying to transition (or to use the buzz word “pivot”) in to the field of UX.  Thankfully, I made the transition and I am now a UI Designer. However, it took a lot of hard work, networking, self discipline, education and pushing myself to learn more about UX every day.

Jennifer Blatz UX design deliverables
Use all levels of fidelity to show your progress through the UX design process.

One way I went about getting experience about UX was to learn as much as I could about the deliverables in the UX field. I would hear a term like “personas” or “wireframes” and decide that I was not only going to learn as much as I could about these topics, but I was also going to put it in to practice.

UX deliverables like performing a competitive analysis can show progress in a project.
UX deliverables like performing a competitive analysis can show steps in a project.

Here’s an example. Say you are a web designer for a flower shop. Sure, you could just design the website per the shop owner’s request. But why not take it a step further? Why not do a bit of discovery and research before starting the design project? You could interview the owners and customers to find out what the business goals and customer goals are. You could do a bit of ethnographic research by observing people shopping for flowers or employees performing a transaction. Sketch our a few concepts before diving in to the code.

Jennifer Blatz design UX deliverables
Creating a mood board helps set the tone of a project and informs you of what designs already exist in the same arena.

If you are trying to get experience in UX, and want to build up your portfolio, use some or many of these methods to show that you are so much more than a visual designer or developer. Show off your analytical skills and how they are applicable to a career in UX.

Here is a brief list of UX deliverables to get you started:

  • User Stories
  • Personas
  • Competitive Audit
  • Sketching
  • Stakeholders Interviews
  • Brainstorming Sessions
  • Moodboard
  • Prototypes
  • Annotated Wireframes
  • Storyboard
  • Information Architecture (Taxonomy)
  • Task Analysis
  • Interviews
  • Ethnographic Observation
  • Heuristic Evaluation
  • Examine Business Goals
  • Examine Customer Goals
  • Content Audit
  • Sitemap Creation
  • User Flow
  • Usability Testing
  • A/B Testing
  • Card Sorting
  • Pattern Libraries
  • Site Map and Architecture
  • Whiteboard and Sticky Notes
  • Functional Specifications
  • Interactive Mockups
  • Style Guide
  • Surveys
  • Market Research
  • SWOT Analysis
  • Use Case Scenario
  • Creative Brief
  • Diary Study
  • Navigation Model
  • Web Analytics
  • Persona Empathy Map
  • Affinity Diagrams
  • Ideation Workshop
  • Task Model
  • Cognitive Walk Through

Now take all of these deliverables and practice creating them. Then,  use the most important UX skill of all: Tell us Your Story.

Ethnographic research – getting to know the environment

Jennifer Blatz Design user research UX UI
Members of hospital staff are working in their natural environment. In this case, a dog is getting prepared for a procedure a technician reviews X-rays on a computer.

One way to really understand how your users work on your product is to view them in their natural environment. That puts their working circumstances and environment in perspective. By observing people, you see things they would not normally tell you. Maybe because it’s so routine they don’t realize they are performing such actions. Maybe because they do not think it is relevant. If you just observe a person in their work situation, then you can decide what actions they take are related to the software or product you are working on.

Here are some questions to keep in when when you are performing an ethnographic research study:

  • Is the work place quiet and calm?
  • Do the users get interrupted a lot?
  • What other tasks do they do while working on your software or product?
  • How is the work station set up? Is it on a desk?  A counter? Shared by several users?
  • What real world objects do they use instead of using the computer? (like post-it notes and pens)

You can learn a lot by acting as a “fly on the wall” and getting a feel for how the workplace is run and how the software interacts in that work flow.

Jennifer Blatz UX User experience interface design ethnographic research
The doctor shows me how her files are situated on a wall so that she knows what items need her attention.

 Value of Ethnographic Research

I cannot express enough how important it is to get out of the office and get in to the user’s real world. In the photo above, had I not visited this doctor in her office, I doubt she would have told me about her paper files organization. It’s just as useful to understand a person’s physical environment as it is to understand their electronic or software environment. That way, you can figure out how you can make the two world meet seamlessly.

Plus, you get to see things like these cutie pies.

Jennifer Blatz UX research User interface puppies software

Exploring options in UX design

I think it is always good to try out different ideas when working on a project. I know that time does not always allow for exploration of several options. But I often find that by playing with a few different ideas, a good concept emerges that you did not expect.

If you are tied too strongly to one design, this expansion of ideas in to something better might not happen. So I encourage you to take some time to always try out different design ideas and layouts and see where the journey takes you. It is often surprising that the first idea you come up with, and the one that you thought was “perfect,” might not actually be the best. Play around with design a bit. That’s what makes it fun!

Here are some examples of me trying out different ideas of a page on a mobile website. Though they have the same content, the execution of the design varies quite a bit. Which design do you think is the most effective? How would you improve them? I am always happy to receive constructive and helpful feedback.

Exploring design option for a mobile website Jennifer Blatz User Experience UX Design
Exploring design options for a mobile website.

The discovery phase in a new UI project

Jennifer Blatz design research and discovery UX
Looking at design examples of dashboards that already exist helps me to get in the right mindset of designing something similar, and hopefully better.

I find that the best best place for me to start on a new  project is to see what’s already out there in the world. I like to do a bit of research, and see what items exist that are similar in design and purpose. It helps me to think about possibilities, what I like and what I don’t like.

I am currently in the process of designing a Dashboard that will be used in several veterinary hospitals. Having never designed a dashboard before, I thought I would scour the internet to see what visual examples I could use as inspiration on helping me get started.

After viewing various dashboard examples, I figure out what traits apply to my design concept, and what do not. Even though I might not have a pie chart in my concept does not mean I would discard a design completely. It’s often useful to pull pieces from several designs and combine them in to one.

As you can see from the collage of Dashboards above, they have a variety of components. Some work within my design and some do not. As the project progresses, we will see if any of these designs or pieces of the design end up in the final product.

20 Websites To Find Free High-Quality Images

Jennifer Blatz Design free stock photo sources from Hongkiat

I recently came across a valuable resource that I thought I would share with the group. “20 Websites To Find Free High-Quality Images” is an article sharing some of the latest ad greatest (?) sites to get free high resolution imagery. Though I have not perused all of the sources, this might be a good list to start with if you are looking for some images.

Thanks to Hongiat.com for all of the valuable articles. If you are not a regular reader of this blog, 2015 is a great time to start.

Characteristics of high-converting CTA buttons

Here are the six characteristics of high-converting CTA buttons.

  1. They are buttons. Save your creativity for another occupation, like writing novels. Button up.
  2. They have compelling copy. Use verbs. And please, for the lost love of conversions, don’t use the word “submit.”
  3. They have logical placement. Eyes move in paths, not jumps. Put it where it will be seen.
  4. They use a contrasting color. Although I don’t advance the idea of toying with shades of gray or blue, or green, I happen to know that buttons with color contrast convert better.
  5. They have close proximity to the previous action. The mind and the pointer have a symbiotic relationship. Your CTA becomes part of that symbiosis as it moves directly into the cognitive and visual flow of the user.
  6. They don’t compete with other crap. If you want to purposely lose conversions by crowding out your CTA, go ahead. I, for one, advance the idea that the CTA should be king of the page.

More on the six characteristics of high-converting CTA buttons.

Creating wireframes for CoCo Website

We are getting so close to implementing actual design. I created a few drafts of a wireframe for an upcoming client meeting. Wireframes are a great way to communicate.

I love that wireframe can be used as a discussion point for so many things:

  • Take your sketch to the next level
  • In some instances, ad branding color and logo
  • Show basic flow of page
  • See if you and your client are on the same page
  • Illustrate some design ideas, and discuss interactivity or animation potential
  • Allow the client to modify concepts because you are both looking at the same thing
  • Working together in person to come up with a better solution

wireframe as a UX deliverable

 

Email design in the UX World of mylife.com

As a UX Visual Designer at mylife.com, I design simple and innovative solutions to complex User Interface problems. Create multiple iterations and concepts for the final online product for desktop and responsive mobile formats. Actively participate in a fully integrated agile/scrum team with product managers, developers, engineers, QA and others. Recommend and implement copy and design changes to improve customer conversion and engagement.

CC-Fail-ID-Premium-Email-3v1-10-14 Onboarding-Welcome-ID-Prem-email-4v4-10-14 Privacy-Meter-email-Cheetah-9-14

Visual designer for my life.com

I will soon have some work samples on the regular website in my portfolio, but I wanted to share some of the projects I’ve been working on as the UX Visual Designer at mylife.com.

As a UX Visual Designer, I design simple and innovative solutions to complex User Interface problems. Create multiple iterations and concepts for the final online product for desktop and responsive mobile formats. Actively participate in a fully integrated agile/scrum team with product managers, developers, engineers, QA and others. Recommend and implement copy and design changes to improve customer conversion and engagement.

User Experience Visual Designer at my life.com
User Experience Visual Designer at my life.com

CC-Fail-PRR-Email-10-14

15 Mobile UX Facts And Insights

I cam across this interesting article about UX and Mobile.

Read the entire story including links at Measuring Usability‘s website.

Designing a better user experience means making sure that users can access information and services across multiple devices, especially mobile devices (phones and tablets).  

In building a better experience, there are many questions about mobile device usage and how designers can best meet users’ needs with apps and responsive designs. We’ve conducted a lot ofmobile usability studies and in the process have encountered many common questions.

Here are 15 data points to help in answering some common questions about mobile usage and behavior. I’ve included as many sources as possible so you can double check our conclusions.

  1. Around half the US’s and 62% of the UK’s mobile phones are “smartphones.” The percentages are similar across Europe. Fortunately for us researchers, most consumers actually know what a “smartphone” is and whether they own one with around 8% not knowing what “smartphone” means. 
  2. Around 20% of the US population over the age of 18 owns a tablet.   It’s about evenly split between Android and iPad platforms.
  3. Tablets have a similar profile as desktops. While tablets get lumped together with smartphones, some data suggest that they are more similar to desktop computers.  Tablet users are more engaged and view about the same number of pages as desktop users. That’s about four times more than smartphone pageviews.
  4. People use full-size tablets at home and in the evening.  In addition to size, part of the reason for the homebound devices might be that only about half of iPads have cellular data access.  In fact, we found the most concentrated time was used at home, on the couch, or bed between 7 and 10pm[pdf]
  5. Most people have over 20 apps (5 or more paid for).  
  6. Most people forget what apps they even downloaded
  7. Most user prefer shopping using websites to apps. One of the more pressing decisions for mobile teams is whether or not to build an app. Going down the app path means supporting multiple operating systems and platforms (usually having different development teams). In our lab-based studies, we also generally see users spending the most time with the web browser and often not knowing whether they have an app or not.  One of the biggest complaints in the mobile browsing experience is the constant nagging of downloading apps and the non-continuity of links that don’t open the apps.  We generally see users prefer shopping on websites rather than using apps. The percentage changes depending on the industry, app and demographic but the app should offer a compelling experience, rich features or something you can’t get in a browser. Update: Changed a link title that cited a somewhat misleading figure suggesting 87% of consumers preferred apps over websites. 
  8. Around half of US smartphone users use their mobile phone to compare prices while in the store. The percentage is a bit lower for Europe.
  9. Most tablet owners still have another desktop or laptop, and despite high usage, it’s still not considered the primary computer. 
  10. Most smartphone users haven’t scanned a QR Code. But if they do it’s usually for finding more product information or obtaining discounts.  
  11. Portrait vs. Landscape?  For viewing content it’s about evenly split with 54% preferring portrait mode.   However, landscape might be more popular for using certain apps.
  12. Conversion rates from tablets are four times higher than smartphones 5% vs. 1% (about the same as desktop conversion rates). 
  13. Consumers who own both a tablet and a smartphone were significantly more likely (63%) to indicate increased overall mobile spending than owners of smartphones only (29%). Larger screen size, full keyboard, and touch screen capabilities are cited as the main reasons for a better shopping experience
  14. Security is a still a major reason why mobile users don’t make purchases. In our 1:1 lab interviews, we consistently hear fear of stolen data as often as usability and screen size as reasons why users don’t like to use credit card or bank information on mobile phones and tablets. 
  15. The more consumers consider and research a purchase, the more they use their smartphones to find product information. For example, 73% of mobile usage in electronics stores was to read product reviews.

When to Use Which User-Experience Research Methods

This post originally came for Nielsen Norman Groups website in the full article “When to Use Which User-Experience Research Methods”. Here is an excerpt  from that article highlighting a comprehensive list of research methods.

Research methods chart on Jennifer Blatz UX Design

20 UX Methods in Brief

Here’s a short description of the user research methods shown in the above chart:

Usability-Lab Studies: participants are brought into a lab, one-on-one with a researcher, and given a set of scenarios that lead to tasks and usage of specific interest within a product or service.

Ethnographic Field Studies: researchers meet with and study participants in their natural environment, where they would most likely encounter the product or service in question.

Participatory Design: participants are given design elements or creative materials in order to construct their ideal experience in a concrete way that expresses what matters to them most and why.

Focus Groups: groups of 3-12 participants are lead through a discussion about a set of topics, giving verbal and written feedback through discussion and exercises.

Interviews: a researcher meets with participants one-on-one to discuss in depth what the participant thinks about the topic in question.

Eyetracking: an eyetracking device is configured to precisely measure where participants look as they perform tasks or interact naturally with websites, applications, physical products, or environments.

Usability Benchmarking: tightly scripted usability studies are performed with several participants, using precise and predetermined measures of performance.

Moderated Remote Usability Studiesusability studies conducted remotely with the use of tools such as screen-sharing software and remote control capabilities.

Unmoderated Remote Panel Studies:  a panel of trained participants who have video recording and data collection software installed on their own personal devices uses a website or product while thinking aloud, having their experience recorded for immediate playback and analysis by the researcher or company.

Concept Testing: a researcher shares an approximation of a product or service that captures the key essence (the value proposition) of a new concept or product in order to determine if it meets the needs of the target audience; it can be done one-on-one or with larger numbers of participants, and either in person or online.

Diary/Camera Studies: participants are given a mechanism (diary or camera) to record and describe aspects of their lives that are relevant to a product or service, or simply core to the target audience; diary studies are typically longitudinal and can only be done for data that is easily recorded by participants.

Customer Feedback: open-ended and/or close-ended information provided by a self-selected sample of users, often through a feedback link, button, form, or email.

Desirability Studies: participants are offered different visual-design alternatives and are expected to associate each alternative with a set of  attributes selected from a closed list; these studies can be both qualitative and quantitative.

Card Sorting: a quantitative or qualitative method that asks users to organize items into groups and assign categories to each group. This method helps create or refine the information architecture of a site by exposing users’ mental models.

Clickstream Analysis: analyzing the record of screens or pages that users clicks on and sees, as they use a site or software product; it requires the site to be instrumented properly or the application to have telemetry data collection enabled.

A/B Testing (also known as “multivariate testing,” “live testing,” or “bucket testing”): a method of scientifically testing different designs on a site by randomly assigning groups of users to interact with each of the different designs and measuring the effect of these assignments on user behavior.

Unmoderated UX Studies: a quantitative or qualitative and automated method that uses a specialized research tool to captures participant behaviors (through software installed on participant computers/browsers) and attitudes (through embedded survey questions), usually by giving participants goals or scenarios to accomplish with a site or prototype.

True-Intent Studies: a method that asks random site visitors what their goal or intention is upon entering the site, measures their subsequent behavior, and asks whether they were successful in achieving their goal upon exiting the site.

Intercept Surveys: a survey that is triggered during the use of a site or application.

Email Surveys: a survey in which participants are recruited from an email message.