Domnicana Victoria Web Design

So easy , So wonderful, so Domnicana Victoria Web Design

Month: May 2015

5 User Onboarding Techniques for Mobile Apps

There was a time when UX was all about delicate and intuitive design. But as we dive deeper into it, we discover more and more factors affecting the user’s experience with a product. It’s far more than beautiful interface now.

The scope of UX gradually expands covering such aspects as web content and formatting, marketing messages and CTAs, customer service, as well as the overall value of a product. So when we speak about good UX, we imagine a satisfied and happy user… whatever it takes.

And how do we make users happy? By solving their problems in the best possible way.

One of these ways is user onboarding.

what is user onboarding?

User onboarding is a set of activities to help turn first time visitors into active users. It is an ongoing process and not a feature that you can introduce once and then forget about it. It’s basically the first experience with a product which turns out to be so great that you want to use it again.

So good user onboarding flow is not limited to some intuitive interface and cute walkthroughs, cause that’s not what solves the user’s problem. You need to deliver value and show your worth as early in the process as you can. With so many apps out there for practically any task you might think of, your app needs to stand out right from the very first launch.

User onboarding should ideally bring the first time user to that magical a-ha! moment when he realizes “this app is exactly what I need”.

How to Design Good User Onboarding Flow for Mobile Apps?

First of all let’s agree that user the onboarding process varies depending on product type. For instance if you are designing onboarding experience for a SaaS, it’s completely different from what you would create for a mobile app. You have to always keep in mind who you design for and what goals you are trying to accomplish with user onboarding.

But let’s now focus on mobile app onboarding.

What is it that makes some users stick with an app while others open it once and then delete it?

Well, obviously you can’t serve everyone’s needs but if a user downloads the app and then leaves, it means your app wasn’t convincing enough. So as a starting point for your user onboarding research you can do a few contextual interviews with successful users to understand what exactly they love about the app, how it solves their problems and what more they expect from it.

Ideally user onboarding will help the first time visitor experience the best of your app as soon as possible thus turning him into an active user. Easier said than done, but there are a few proven techniques that can help you design great onboarding flow for a mobile app.

1. Interactive tutorial or walkthrough

While some publications consider walkthroughs the same as user onboarding, I personally think it’s a vital part of onboarding but certainly not the same thing. A tutorial is a nice way to greet the user but you should be careful not to annoy him by teaching things he already knows.

So if there’s anything in the app interface or features that might confuse the user, it’s definitely worth doing a quick walkthrough. However try to make it quick, easy and effortless. It’s all about showing how exactly the app is going to make the user’s life better. The story should be about the product and not about the interface, no matter how proud it makes you feel.

2. App permissions

This is a very tricky part in the onboarding process, because asking permissions at the wrong time and place may ruin the user experience and annoy the user to the point of deleting the app altogether. But if iOS users at least have the right to give this or that permission to an app, poor Android users won’t have that privilege until the official release of Android M. Anyway, it is very important not to ask for something you don’t really need to provide the service. But even if your app really needs access to certain information on user’s device, make sure to give something to the user first before asking for permissions. It’s the simple reciprocity rule (best described by Robert Cialdini in his book “Influence”). First provide something of value for the user and then only ask something “in return”. Let them use the product straight away and ask permissions only when the app cannot technically operate without them.

3. Simplify or remove signup

To highlight the importance of having no registration forms just ask yourself how much spare time do you have and how much do you enjoy filling out lengthy registration forms? Not much, I believe.

So ideally a good mobile app onboarding is the one without a signup. However if you do have a registration form, you can still minimize the pain. Do your best to make it as short and comprehensive as possible. Ask very little upfront and try to save user’s time by implementing smart defaults, inline validation, completion status bar or any other usability hacks that work for your app.

4. Lifecycle Emails and push notifications

Now when you have made a great first impression, it’s time to retain your precious users. At this point you can go ahead and use email (if you have previously gathered that information) or push notifications to remind the users about the app. But remember not to be too intrusive. Make sure the alerts and notifications really have value for the user.

You can also run email drip campaigns, which are basically pre written emails that are sent to new users with predefined intervals, say on day 1, day 3 and day 7. With the help of these emails you can guide the users through the app, introduce new features and inspire them to get the most out of the app. Take for example Steller, a social networking app where users create and share visual stories. Steller sends daily “story of the day” emails featuring the most popular stories thus gently nudging users to create new stories themselves or at least browse existing collections.

5. Human customer service and support

It’s always reassuring to know that there are real people behind a product, people who are always ready to help with any issue or question with the app. Caring for your users and making them happy should be your top priority, at least users need to feel that it is. Creating and maintaining good relationships with users is a vital part of onboarding. None of your marketing efforts will speak louder than satisfied users. So make sure to have a well-trained and empathetic customer support team.

So as you see, good user onboarding requires commitment and a whole lot of effort on daily basis. You need to put these onboarding techniques at the foundation of your app marketing strategy, but above all these you need to provide value to the user no matter what you do. Only then you will have a sound product strategy and hopefully your own brand evangelists.

10 Pro Tips to a Smarter Design Process

Being a UX designer myself, its important that we fall back in love with the art of design. Especially when you hit a creative wall.

The reasons vary. Maybe youve been working too fast and too hard and burnt out. Maybe you work in a non-creative environment and contend with a lot of resistance each day. Maybe youve unknowingly become a repeat performer, putting out the same work over and over again. Or maybe youre just bored.

A design process empowers you to confidently innovate because you can map the inception of an idea to its evolution.

Your process should never be so ideal that it cant change. Every project has limitations. Whether it’s resources or skills, your design process must adapt to all these real-life constraints.

Heres 10 tips for improving your own design process based on what I’ve experienced in my own career.

1. Define the problem before hunting for solutions

Einstein once said, If I had an hour to solve a problem I’d spend 55 minutes thinking about the problem and 5 minutes thinking about solutions.

Many designers make a fatal flaw in thinking problems are obvious. Most of the time obvious problems are merely symptoms of the real problem. You will know when youve found the real problem because it will eliminate a lot of other issues at the same time.

As described in the free e-book Web UI Best Practices, start all your design projects with the How Might We…approach of design thinking. Remember that before you design the product correctly, you first need to ensure youre designing the correct product.

2. Know your user like the back of your hand

A developer once told me she was building a product for everybody. That might sound reasonable for a mass market product, but you cant create meaningful use cases if you cant pinpoint a specific user.

Without meaningful use cases, its hard to know what your MVP (minimum viable product) needs to be or how to create a strategic product plan. All great products strive to solve a handful of problems as simply as possible, in a way thats easily understood by the people who need it.

Conduct user research, create personas, and start mapping out user scenarios and flows. Anything that puts you deeper into the mind of the user is an investment in successful design.

3. Consider extreme solutions to the problem

Part of the fun in designing is going a little off the deep end with ideas. Celebrate the opportunity to think big.

Break conventions just for the sake of it. Think beyond a single device. Storyboard a day in the life of a user and see where all the possible touchpoints could occur. Bust out the markers and crayons. Do whatever inspires you to think unconventionally.

Dont spend weeks (unless you can afford the time) but take a creative pause to connect your unconscious mind to the problem you need to solve.

Take a look at Duolingo. The app feels more like a smartphone game than a language learning platform. Its completely unconventional and might sound questionable on paper, but the proof is in the numbers the company is valued at $470M by Google Capital as of June 2015.

Seek inspiration outside of your immediate industry, and youd be surprised by how effective (and creative) your design solutions become.

4. Establish a hypothesis to test before you design

 A hypothesis introduces a way to seek truth. Every design has a foundation grounded by something strong enough to build upon.

Think of it like an essay’s thesis statement. It is the heart of the design. And its where your use cases come into play far ahead of development work.

Brainstorm as many scenarios as possible and whiteboard with your team. Run a design studio exercise in which participants sketch their solutions for how to complete specific tasks. You should always explore (and iterate) your hypothesis as one of the first steps in design.

For a useful framework, check out Maximilian Wambachs (Interaction Designer at Ebay) approach. The If [action] then [outcome] because [customer need/problem]mindset is extremely helpful.

5. Collaborate with a diverse group on the best solution

If your design is solid,  it should hold up to critique and discussion. A group of people from different backgrounds who possess different experiences will lead you to better solutions.

Consider setting up a Think Tank of stakeholders to share their unique perspectives on how your design can be improved. Work with your design manager to ensure that the product team still has the final say, otherwise you fall into the trap of design-by-committee.

6. Create a story with documentation

Produce documentation that tells a story. Your personas are the cast of characters. Your use cases are key parts of the screen play. Your wireframes are the stage. Your process flows and user flows are the choreography. Your UI kit is the set design.

Everything relates and feeds into each other.

Many times documentation is ignored because it lacks context. Think of your design assets and artifacts as puzzle pieces. On their own the pieces have little value, but put together they build a picture that tells a story.

Dont get tunnel vision and obsess over perfecting one design document. Instead, make sure the relationships between each design stage is easily understood.

Minimize documentation that doesnt move the design forward. If your documentation isnt usable, theres no reason to create it.

7. Design and test on paper

Rapid paper prototyping can be done at any stage and always helps inform design decisions.

Give yourself or a group a set amount of time to quickly iterate ideas. Its very easy to become attached to a design once its move into pixel form. Sketching and prototyping on paper, however, keeps your mind searching for possibilities.

Draw out sketches for the sake of exploring your own ideas, then run a quick hallway usability test with 3-5 people.

As soon as you come up with a design you think is solid, start testing it by conducting a virtual walk-through. Talk through the different use cases with a partner so you can help each other notice any gaps or potential flaws. Once your partner understands how the design works, they can act as the human computerfor operating the paper prototype during usability testing.

8. Post artifacts on a wall

Having tons of post-its on a wall might seem cliche, but theres a  sound reason behind the method. .

Think about all those detective shows. When a detective is working a case, a wall is transformed into a map of the crime. All of the witnesses and suspects are displayed with the evidence thats been collected.

The same thing occurs when youre designing for specific users. Just like a detective, a UX designer needs to map the connection of the problem to the users and then link it directly to the solution. The physical artifacts arent for show. Having a shared place for a team to visit at any time helps infuse UX methodologies into everyones workflow.

9. Create a lo-fi  prototype to test

Lo-fidelity prototypes can be created with basic HTML, Keynote or Powerpoint, paper cut-outs, storyboards, and specialized prototyping tools like UXPin (which I’m quite familiar with).

As soon as you move into development, certain restrictions are inevitable (browser compatibility, site performance, etc.). Test your design before development because it will better inform your user stories and provide developers with rich insights.

Low-fidelity prototypes allow you to link up multiple wireframes to create flows. In this way, you can test the effectiveness of the order of things, rather than just the elements that the user sees on-screen. You can validate that sequences of interactions make sense for users.

10. Build collaboratively

No designer is an island. Too often people work for too long by themselves.

Just like pair coding has been proven to reduce technical error (because its easy to become code blind), try Coopers pair design technique for better analysis and iteration. Working with another person generates motivation for self-improvement, establishes a sense of teamwork, and balances productivity by sharing energy.

Its pretty old school to think that you can only design well when youre tethered to a desk away from everyone. That idea is as outdated as smoking in the office. By following the guidelines described in Building Mockups Developers Won’t Hate, your projects can be fun and collaborative.

Ready to create your own design process?

Get started with the UX Design Process Map below, then start practicing in tool like UXPin so you can design with your team together.

18 ways Doctor Who can make you a better designer

How Doctor Who taught Jason Cranford Teague to design.

Doctor Who has been with me since the very formative years of my life. As a you pre-teen in the US of A, I discovered my life-long hero one wonderful afternoon when I turned on the local PBS (Public Broadcasting System) channel. Where I lived in the early 1980s, Doctor Who came on everyday at 5:30pm, and I watched him every day at 5:30pm.

Needless to say, the good Doctor has had a profound impact on my life, so I was not too surprised when I realized that most of the lessons I have learned as a designer over the years tied back to what I learned watching the charismatic Timelord.

01. TARDIS: Time and Relative Dimensions in Space

Design is about more than the visual (space), it’s also about the temporal (time). You know, “Wibbly-wobbly, Timey-wimey… stuff”. With interface design, thinking about how your work behaves in space and time has become a necessity.

02. It’s bigger on the inside than the outside

The best designs are always outwardly small and simple, but inwardly deep and complex.

03. Whenever you go into a new situation, you must always believe the best until you find out exactly what the situation’s all about. Then, believe the worst

In interface design, we have something called the ‘happy path’ which is the direction we hope most people will be able to follow, but we have to think just as carefully about the alternatives, since those are often the spaces that our audience will be the most frustrated and need the most help.

04. The trouble with computers is, they’re very sophisticated idiots. They do exactly what you tell them at amazing speeds

Computers are stupid. We often forget that because they are so fast at doing math. But a computer has no intuition and can’t make assumptions about a persons actions, that takes the intelligence of a designer.

05. Spoilers, sweetie

Always let the audience know what’s coming up, but don’t give away too much before they need to know.

06. Reverse the polarity of the neutron flow

Even the most complex problems can benefit from a different point of view. I regularly turn design problems around to try to find better answers.

07. Even the sonic screwdriver won’t get me out of this one!

Your tools will not make you a better designer, but they can make design harder for you if they are not the right tool.

08. I’ve never met anyone who wasn’t important

We often think about personas in design, individuals who represent our audiences, and that six test subjects is plenty. But I prefer to get out and talk to as many people as possible, I can never get enough feedback from the people actually engaging with my designs.

09. The least important things lead to the greatest discoveries

Small elements in a design often need the most attention, because they can lead to the greatest impact if done effectively.

10. Answers are easy. It’s asking the right questions which is hard

Answers are often obvious in design if you are asking the right questions, but sometimes finding the question is the tricky bit.

11. Time will tell, it always does

When the answer to design questions is not obvious, I’ve learned to wait and see. Either wait until the development phase or even wait until after launch to see how it works in the real world conditions before making the final decisions.

12. Hold tight and pretend it’s a plan

Design intuition means that I can see an answer often before I can explain it. Sometimes that means the people on my team have to rust me, which is not always a given.

13. I love humans… always seeing patterns in things that aren’t there

We see patterns everywhere, because we are hard-wired to do it, especially faces, phenomena known as ‘Pareidolia’. This is a powerful tool for designers since we can draw audience’s attention to or from objects on the page using patterns.

14. Would you like a Jelly Baby?

Surprise and delight are powerful tools for crafting an effective interface design. Giving something, no matter how small, to the audience always helps to get them on your side.

15. The very powerful and the very stupid have one thing in common. They don’t alter their views to fit the facts. They alter the facts to fit their view

Content is the ‘facts’ around which we fit our design ‘views’, but so many designers expect their content to fit whatever they design. I always try to start with the content I am design for first, and then work to make the design fit to that.

16. There’s always something to look at if you open your eyes

Never stop looking at your designs. You may want to walk away for a bit, or reverse the polarity of the neutron flow, but always keep the designs you are working on in the corner of your eye, even while working on something else, because you never know when inspiration will strike.

17. There’s a lot of things you need to get across this universe. Warp drive… wormhole refractors… You know the thing you need most of all? You need a hand to hold

Designers are often thought of as solitary figures, busily sketching away. But what I have learned is that having partners – companions, if you will – always makes for better creation.

18. We’re all stories, in the end… just make it a good one, eh?

Every design, no matter how seemingly simple, should tell a good story.

Series 9 of Doctor Who starts tomorrow on BBC One in the UK.

Words: Jason Cranford Teague

Jason Cranford Teague is a Senior Creative Director at Capital One and teaches workshops on experience design for developers, development for designs, and temporal design thinking.

7 essential SEO tips for developers

Building any new site requires careful SEO management. Peter Richards presents his seven-point plan to help improve site visibility.

Search engine visibility is the number one priority for most online businesses, but thriving in these competitive spaces can be a huge challenge. This is often compounded by a lack of collaboration between teams, which is a recipe for disaster! These steps will help you improve the performance of new site developments and existing migrations.

01. Block staging servers

One common issue is in the development and staging versions of a website. Crucial for testing landing pages, these can also be the most vulnerable regions of the site. If no access controls are in place, search engines will crawl and index these areas. The result of this is page duplication, which can lead to ranking drops or content on the development server outranking the real stuff!

To guard against this happening, you can take any of the following approaches:

  • Specify the IP range, which uses the firewall to restrict access and block search spiders
  • Include a ‘robots.txt‘ file at the root of the development server, which disallows spiders
  • Create a password-protected login page, which also prevents spiders accessing content

02. Manage redirects

Redirects are common practice within site management and are necessary to indicate the new location of content if pages have been moved or deleted, or when whole domains have been migrated. Without the correct redirects in place, visibility within search engines can drop. There are three main issues to avoid:

Using 302 redirects for permanently moved pages: 302 temporary redirects pass no link value to the target page (301 permanent redirects sacrifice only 1-10 per cent of value).

Redirect hops: Multiple redirects in a chain require extra server requests, slowing down the delivery of a page. If the chain exceeds five hops, it’s likely search engines will abandon the crawl and the page may not be indexed regularly. What’s more, each redirect will lose a small percentage of link value.

Excessive use of redirects: Redirect-overload will negatively impact server performance. Use wildcards and regex to optimise for speed.

03. Canonicalise your site

Canonicalisation is the prioritisation of a single web page as the authoritative source of that page’s content. This becomes a problem when the same content is found on multiple web pages and the authoritative source is unclear, splitting the power from inbound links (link equity) across all versions. Using the Apache Web Server default settings as an example, these URLs would serve identical content:

  • http://www.mysite.com
  • http://www.mysite.com/index.html
  • http://mysite.com

To manage these duplicates effectively, implement a permanent 301 redirect rule to point each URL variant at one canonical or preferred URL.

URLs that render the same page content with or without a trailing slash (/) can also cause duplication. Generally it is wise to configure URLs either with or without the trailing slash and create a 301 redirect rule to direct users away from the discarded version. You should also ensure internal navigation points directly at the correct version of the URL to maximise link value within the site.

Another option for managing duplicate content is to use the rel=canonical tag on each variant. This is designed to indicate to search engines which is the authoritative source.

04. Remember mobile

Developing or migrating a site without planning for a mobile audience means missing a massive opportunity. According to comScore, the number of global users accessing the internet via a mobile device has now overtaken the number using a desktop. In response to this trend, Google has developed a new algorithm which is expected to aggressively push its mobile agenda forward.

Early adopters of mobile strategies utilised a subdomain (m.mysite.com) containing a similar version of the desktop site. This route often requires extra resources to manage two separate frontend codebases plus one backend system. It can also lead to duplication if pages on each are not correctly tagged, which may result in a Google penalty. If you suspect your site has been penalised, try this handy tool.

Google is an advocate of both responsive mobile-first design and progressive enhancement. Rather than creating a feature-rich site that displays well on desktops then hides functionality on mobile, a mobile-first approach starts with a design that is attractive and functional on the smallest screen. Designers should then progressively enhance the interface towards the desktop experience.

05. Speed up your pages

Page speed is one of the key ingredients within Google’s ranking algorithm. If pages take too long to load, users will abandon the site. Not only is this bad for business, it may also attract the wrong sort of attention from Google.

Designers and developers should ensure sites are as well optimised as possible by utilising the following recommendations:

  • Use inline styles only for ‘above the fold’ content
  • Avoid code bloat by removing JavaScript and CSS code to external files
  • Minify the source code to remove unnecessary ‘white space’
  • Configure the server to enable gzip compression
  • Use CSS sprites where possible to reduce the number of server requests
  • Enable asynchronous downloading and rendering of external JavaScript files

06. Use the right HTML elements

From an SEO perspective, arguably the most important HTML elements on a page are the heading and alt tags. Without these in place, webmasters are missing an opportunity to assist users and search engines in understanding page content.

With accessibility in mind, having the correct heading structure in place makes it easier for screen readers to decipher areas of content by referring to structured headings.

Most SEO-friendly sites utilise a heading tag hierarchy similar to the example below:

  1. <h1>Main Heading</h1>
  2. <h2>Secondary Heading 1</h2>
  3. <h3>Sub-section of the secondary heading 1</h3>
  4. <h2>Secondary Heading 2</h2>

The H1 tag is the most important and should always be included on a page. Search engines still pay attention to words used within the H1 (similar to the <title>) to check the relevancy of the content associated with it, and also to help rank the page for keywords in search queries.

Although HTML5 allows for multiple H1 elements, only one is necessary on each page to avoid confusing both users and search engines. At best search engines may simply ignore multiple H1 tags, or they may view it suspiciously as a method of promoting more keywords.

07. Manage errors

When pages within a site are deleted or moved and the original URL is no longer providing content to users, that page should return a ‘404: Not Found’ response code and a branded error page. By default, Google will not index these pages.

A common misuse of the error page occurs when it is returned with a ‘200: OK’ response code, usually on URLs that have been deleted or moved. This is problematic if widespread, as these URLs are still likely to be indexed. If the abandonment rate is high, the site may be penalised by a quality assessment algorithm such as Google Panda.

Powered by WordPress & Theme by Anders Norén