Optimizing Images in the User Experience

Apparently, large images are the way to go. Ryan Battles outlines the how the use of images can affect customer decisions – to buy or not to buy? Bigger images usually meant greater conversions. Saloman, a snowboarding company, increased sales by 40% with these two designs. The above image is the BEFORE – it’s not bad. The above image is the AFTER – emphasis on large graphics.
salomon1

salomon2

Advertisements

Getting Users to Subscribe – give me your email!

One of the hardest things to do is to get users to subscribe or join. That’s where most of the site bounces come from. I personally hate filling out long forms. But even when it’s just email and password, we all get a little squirmish – “ugh, they’re gonna send me spam. what’s the point in giving them the email address?”

emailupdates

The Smart Passive Income Blog does a good job with getting users to subscribe. Not only do they simply ask for name and email, they give a friendly, casual blurb of what’s in it for the user. All of sudden, I don’t think they want something from me (my information) but they are giving ME something. This makes a huge difference, and apparently surged sign-up’s by 25%.

Good form

UX Project Checklist

Research

Competitive AnalysisSee how others solve similar problems and try to not reinvent the wheel. Read more

Data analysisDo you have all the useful data you need? Try to have a look at funnels, clicks, page views, performances… Read more

User feedbackAlways speak with Customer Care team! Don’t have one? Check your old surveys or videos, what your customer says? What do they actually do? Read more

Plan

User storiesHave you done personas yet. If not DO IT NOW. Ok, now use them to write down user stories and scenarios.Read more

User flowsCreate your user’s flow based on the scenarios you created, you can use it later to review the journey and create wireframes on top of each step. Read more

Red routesDefine red routes for your product and you’ll be able to identify, prioritise and eliminate any usability obstacles on key user journeys. Read more

Explore

Brainstorm & sketchFind a war room, fill it with markers and drinks, get together and sketch, discuss, vote, disrupt, have fun! Read more

WireframeAdd some details and structure to your ideas, reuse patterns and create pages on top of your user flows so you’ll not leave anything behind. Read more

PrototypeYou can start creating paper prototypes and continuously iterate to more functional ones. Use sketches, HTML pages or static images, then just get some people and test. Read more

Communicate

IAUnderstand your users, your data structure and your channels. How can you organise your navigation and content in a clear and consistent way? Read more

LanguageFollow your brand personality, keep in mind users’ culture and language, the context of your product and make sure they understand you. Read more

AccessibilityYou don’t need to add extra functionality or to duplicate any content. The key is simply to assess the requirements of those with different skills and limited devices. Read more

Create

UI elementsReuse elements and patterns, follow your style guidelines, don’t have one? Create your guidelines. Start small, then create pages. Read more

GesturesSo you’ve have a swipe slider? Tell me more about pinch, drag, zoom, rotate, shake, six-inch smartphones, left handed people, mouseover, kinect, motion detection… Read more

ResponsivenessCan I see it on my mobile? Oh wait, what about my smart-watch which work as a remote for my 50″ TV. Bonus: remember cross device experience. Read more

Give feedback

Waiting timesIf your users have to wait ages for the page to load, at least show them a loader, if take longer why don’t you try something more entertaining? Read more

ErrorsBe clear and specific on what and where user’s error is. I mean, your error, because if it’s your fault you should say it.Read more

Completed actionsGive immediate and clear feedback of successful user’s actions. Do not always wait for server response, trust your server once in a while! Read more

Finalise

Finalise layoutIt’s time to let your design shine, make it in the right way, don’t stop with the first solution, always ask “is this the best you can do?” Read more

Use of images and iconsUse of icons and images is strongly influenced by context, culture and layout that you use. Like icons, test your images, small changes can bring huge improvements. Read more

Font & colours hierarchyUse colours and font sizes properly, tryto follow your guidelines and keep it simple. The best visual hierarchies lead users to take the action confidently. Read more

Delight

Micro copyEvery word is important, and a bit of personality will help your brand. Read more

Micro interactionsTrigger, rules, feedback, loop. Details make the product. Bonus: Ever heard about easter eggs? Read more

TransitionsMotion shouldn’t be only beautiful, it have to builds meaning about the spatial relationships, functionality, and intention of the system. Read more

Analyse

KPI SetupWhat you want to achieve? What are your goals? Write down how you define success and failure and check if you have everything you need to collect the data. Read more

AB Test planPlan your AB test ahead and, if you can, plan a short roadmap of improvements. Your goal is not just improving KPIs, but learning something. Read more

TestUX lab, survey, sessions recording… test, observe and fix, test, observer and fix… Read more

What Color should I make that Box/Popup/Widget/Icon…?

My recent project involved designing a dashboard/control panel. What I played around the most with was the colors. I changed the header image to a variety of colors.

In his “7 Rules for Creating Gorgeous UI”, Erik Kennedy’s second rule is to start designing in grayscale, so one can focus on the layout and organization of the elements. It makes sense to me. He also demonstrates how when you design in grayscale, you can just add one color and everything looks visually appealing. Here are two of his examples:

I’m considering changing my portfolio to incorporate this concept. It looks really modern, but also photo-centered, which I’m unsure is appropriate for a UX Design portfolio.

Ian Storm Taylor goes on top say “Never Use Black”. It’s unnatural in the real-world – shadows aren’t black themselves. He pushes for saturation and the use of dark greys, playing around with brightness and hues. I remember considering using black in one of my designs and ditched it for dark grey. It looks much better.

Finally, this resource would be definitely helpful for myself. I have to play a lot around with what color goes well with another. I remember showing a prototype to some friends who instantly comment, “that blue and green don’t go well together” – and they don’t, I never thought they did either. Dribble allows you to see what other designers have usedfor color combinations. I looked up the blue color which I tend to gravitate towards, and just realized how good it looks paired with orange. I never thought of that – I tried green and yellow before, but I’ll definitely want to try orange in the future.

Product Design: OVER-communication is key!

Communication and a quick feedback loop will save a significant amount of time, money, and work at the expense of just talking to team members a little more. I can relate this to one experience I had with a startup, who I feel did not communicate anywhere near what I would have wanted, and needed. A big problem was that I didn’t know their design goals clear enough.

I would submit deliverables (sometimes when they didn’t even request it…I just wanted to make their website so much better than it was!) and get replies days after or none at all. When they would reply, I would have wanted a ton more feedback, particularly on every design decision and why it wasn’t implemented. I couldn’t tell whether it was a limitation, a preference, a disagreement on ideas, or what. For instance, I may have raised a flag about a form error and I presented a potential fix (I’m always one to not bring up problems I see without also giving at least a shot at a solution). I got no feedback on it, so I submitted it again (along with other deliverables). Still nothing. I have no idea what they feel about the flag I raised, and it certainly is a reasonable issue. So I was at a loss at that point.

Lesson: to do the best work, designers need to know the team’s goals like the back of their hand. They need to get feedback on every design decision, especially when it is not taken. It can be frustrating to a UX designer when their recommendation, based on cognitive psychology research and standard UX principles, is not taken – it doesn’t make sense to them. The solution is overcommunication. Spend some more time with your team members and save a ton of wasted efforts. It’s well worth it, especially in a lean start-up.download

Considering a Career in Product Design

Erick Eriksson, Product Designer at Spotify, talks about the general space of Product Design – what it is and what it isn’t.

In his post, Product Design is not just about visuals or attractiveness, although these are important. Product Design is about finding solutions, the process in obtaining said solution, and determining what problems have enough value in solving. It’s all about brand identity and communicating the product’s message and functionality beyond its appealing form. The process is rather comprehensive, and specialties have arisen to target specific tasks within Product Design, such as User Researcher, Prototyper, Data/Business Analysts, Graphic and UX Designers. It’s all about the final product and the value it serves. This means a combination of several disciplines. But this type of breakdown only really exists in large companies. Anyone playing this role in a smaller environment will quickly find themselves in a hybrid role.

The lesson here is that technical managers should never ask their team members to simply “make it pretty”. Defining the product and the visual design go hand in hand.

Egotism vs. Empathy in User-Centered Design

Does self-centeredness hinder effective UX design? It seems like it would.

We may describe a self-centered person as arrogant, intolerant of differing opinions, overconfident, and lack empathy. In addition, they can’t see different viewpoints. They are usually fixated on their own viewpoint and may harshly criticize others who don’t buy into their views. The Huffington Post even wrote an article “How to Deal with Self-Centered People” to shed advice on those particular individuals prevalent in our workplace and schools.

Egotism’s counterpart is empathy, often touted as an essential in UX Design in reference to utilizing personas. A persona is a (largely) fictional snapshot of a typical user. Personas enable designers to focus on a manageable and memorable cast of characters. It ensures designers keep in mind that they are designing for a specific somebody, rather than just generic people. If designers lose this sense of empathy, they may end up designing for nobody. Smashing Magazine wrote a compelling article on the possible effectiveness and reasoning behind personas.

Sure, personas can be sketched out, but do all designers know how to utilize the full potential of personas? Maybe self-centered people have difficulty relating even to the fictitious personas in front of them, especially if it goes anywhere near the line of empathizing with a possibly less adept or a less tech-savvy thinker. In an industry where brains is commended, prevalent, and sought, there ought to be those who are more on the egotistical side. Those would be the ones saying, “only an idiot would think that way” or asking, “how could someone be so foolish?”. How effective can a self-centered person be at user-centered design?

Source: http://asinthecity.com/

Source: asinthecity.com