Wednesday, 27 July 2016

The Best UX/UI Designer Tools, Resources, Blogs & Books Collection - Part 1

It can be intimidating to get into user experience, but don’t fear: there’s plenty of help around. To help you navigate that sea of information, we make a cool list to share with you. This list covers UX/UI blogs, resources, books and tools (in no particular order). I hope it will help you guys to get better at what you’re doing!

UX Blogs and Resources



1. Awwwards -A place to find inspiration and talent; a space for debate; a place to share knowledge and experience.

2. UX Magazine -This site creates a community with location-based listings for conferences, jobs, workshops, informal meetups, and classes.

3. UX Myths -Collects the most frequent user experience misconceptions and explains why they don’t hold true.

4. Designer News -Best UX/UI related articles collection.

5. Usability Geek -A wider array of topics that extend beyond usability, such as User Experience (UX), conversion, Human Computer Interaction (HCI) and Information Architecture (IA).

6. Lukew -A Product Director at Google shares his views on Web and device strategy, interaction design, visual design, usability, and much more.

7. Design Talks -545 Talks for Designers from 68 UX/UI conferences all over the world.

8. HelloErik Experience Design -The design and experience blog of Erik Flowers.

9. Weeklypixels -Reviews on design Books, user experience books, UX processes, graphic design books, typography books, lettering books.

10. UX Booth -Feature content on analytics, content strategy, information architecture, interaction design, philosophy, research, universal design and accessibility.

11. Mockplus Blog -The newest UX/UI design resources recommended for UX and UI designers.

12. Smashing Magazine’s UX Design Category -UX/UI experts share with you their valuable ideas, practical tips, useful guidelines, recommended best practices and great case studies.

13. Design Shack -Showcases inspiring examples of design, alongside resources and articles.

14. Creative Bloq -It is a high volume blog for creatives that features content on web design, illustration, graphic design, 3d, digital art, and more.

15. Beautiful Pixels -Showcases some of the best examples iOS and Android apps as well as UI design across various types of media

16. UX Movement -Publish articles showing how good and bad interface design practices affect user behavior.

17. DesignModo UX -Resource for both beginners and advanced designers looking to expand and improve their knowledge.

18. 1stwebdesigner -Post the latest design resource for UX/UI designers.

19. Noupe -Feature content on responsive design, UX/UI, web development, inspiration and more.

20. Six Revisions -Publish articles, guides, tutorials, news and other forms of content for people who design and build sites and apps.

21. Speckyboy -Fresh and useful resources and inspirational art, covering web design and development, graphic design, mobile development.

22. Designzzz -Offers free and useful resources for designers and developers.

23. Vandelay Design -Post creative bouts of inspiration that we all need for success.

24. Boxes and Arrows -The practice, innovation, and discussion of design.

25. InspirationFeed -You’ll find industry guidelines, case studies, design & development resources, tips & tricks, and other related web articles here.

26. Usabilla Blog -Useful UX articles or designers.

27. Dribbble -An online community for showcasing user-made artwork.

28. Behance -Showcase and discover the latest work from top online portfolios by creative professionals across industries.

29. NN/g -A leading voice in the user experience field.


Free UX & UI Books














Click here for more details about these UX books.

We hope you enjoyed getting to know about these design resource and tools. Hopefully, through them, your journey of being a UX or UI becomes easier!


About Author

Becky
Email: becky@jongde.com

Tuesday, 26 July 2016

Basic UI/UX Design Concept Difference Between Wireframe & Prototype

The terms of ‘wireframe’ and ‘prototype’ are always get confused by designers, despite the experienced designer, possibly due to the misunderstanding or some other reasons. Actually, the concept between the two terms is quite obvious and different. Now, let’s distinguish the two terms clearly.

What is a Wireframe?

Wireframe is a low fidelity layout of the design which has 3 simple but direct targets:
1. Presents the main information group
2. Draw the outline of structure and layout
3. Vision and description of the user interface 

It will be your product’s main structure after you created a wireframe correctly. Just like the blueprint of a building, it describes details clearly and specifically.

Visual features of wireframe


Wireframe exists very obvious visual limitations. In general, designers only need to use lines, boxes, and gray color (different grayscale indicates the different level) to complete.

Simple vector wireframe

The content of a simple wireframe should include pictures, video, and text etc. Thus, the omitted will be replaced by a placeholder, picture be instead by a shaded, and text will be replaced by some symbolic words according to the text layout.
Advantage of wireframe

The building of wireframe is fast and cheap, especially if you use these prototyping tools such as UXPin, Mockplus, Balsamiq, and Axure. Of course, you should use these tools to do it at the very beginning.

Compared with a complete and detailed high fidelity wireframe, gathering feedback is much more important. Why? Because people pay more attention to software functionality, information architecture, user experience, user interaction flowchart, and it’s usability, rather than considering the aesthetic characteristics of these elements. Meanwhile, in this case, you can easily modify it according to demand, but not need to adjust coding and graphic editing.

Interactive wireframe



Sometimes, designers prefer to improve the fidelity of wireframes to enhance the importance of user interface at some aspects and display the rationality of interaction between fast test and the visual elements. Program to address these problems properly is using interactive wireframe, also known as the clickable wireframe.


If you want to create such a complicated wireframe, then you need UXPin, which is a tool for wireframing and prototyping design. Interactive prototyping may be the best presentation to developing team and clients. When you came across the problem that “what it will happen when I clicking this button?’’, you just need to click and show to your clients how it works on the interactive prototyping. Indeed, it’s quite impressive and direct.

Show wireframe cautiously

You must be cautious about the guy who is totally a layman when you need to present your wireframe to him. He may be your client, also may be a non-technical manager took part in the cooperation. But he does not know the truth that the wireframe and the final product may seem unrelated. So, he may not understand the intrinsic link and operation mode between them. Thus, you need to figure out a proper decision whether you need to present and how.



This is an app user operation flow chart sketched by Fernando Guillen. Of course, it’s undoubtedly the early design version.

A wireframe is the most important part of a design. When you saw this flow chart, you’ll understand why it’s time-consuming to explain what is called wireframe and why we need to use wireframe. Or, you just skip this step.

Prototype

The requirement of a prototype is higher than wireframe/interactive wireframe, it must be a high fidelity prototype which is interactive and fit the final user interface as much as possible.

The target of prototypes is quite obvious: to simulate the interaction between user and interface as realistically as possible. When a button is pressed, the corresponding operation must be carried out, and the corresponding pages must appear, try the best to simulate a full product experience.

Visual features of prototype



Undoubtedly, the prototype must include the aesthetic features of a product that should have, and try to fit the final version. Basically, it’s a skin of a product, no HTML/CSS/JS involved, and not necessary to consider the server and database.

Advantage of prototype

Why it’s so important? Because prototype is usually used for users to test product. Prototype test at the very early stage can save a lot of developing cost and time. So that it won’t waste the effort of back-end product architecture due to the unreasonable interactive interface. So, prototype is a perfect progress to test product for designers and developers.

Besides, providing prototypes with users to collect feedback, that’s benefit to have an insight into all the details of your product, and inspire the whole team. Many of the prototyping tools can build prototypes quickly and efficiently, but no coding needed.

Design flow

After you have insight into the essence of design and known the difference between wireframe and prototype, you are standing in front of the user experience design world.

If you can concrete the series of product design into a cohesive and effective work flow, amazing thins will happen.

Tips

Try to use editable and reusable elements when make wireframe. In that case, you just continue to refine the elements to complete prototypes based on wireframes.

When you make wireframes, try to gather thoughts and opinions from your team and clients, and try to reflected them on wireframe designs.

Use your most handy tool.

UXPin


UXPin has built more than 900 kinds of different UI elements for you to create wireframes and prototypes.

Proto.io



Proto.io is a very robust prototyping tool, and it can export HTML / CSS code based on a prototype, and interactive prototype for touch screen, which allowing users to test on actual devices.

Balsamiq



A popular long-lasting wireframe tool only for static wireframe.

Moqups



This tool supports to make wireframe directly online.

Mockplus




Mockplus is the all inclusive prototyping tool for fast interaction, fast design, and fast previewing. It allows to create mockups for mobile (Android & iOS), Desktop(PC & Mac) and web apps. 

Axure


As a most popular wireframe & prototype design tool, do we need more introduction of this tool? I think no.

Protoshare



This tool also can make wireframes & prototypes online.

InvisionApp



This tool can help you create usable prototype, you cannot draw anything, but you can add links between different screens.

Original Publish at: www.mockplus.com

About Author

Grace Jia
Prototyping tools, UI&UX news & information, article sharer, writer.
Email: gracejia120@163.com 

Saturday, 23 July 2016

Sharpen Your Skills: The Value of Multidisciplinary Design

Design is everywhere; It is all around us.
Every time we look around, everything we see has been designed at some point. We design our environments, our food, our virtual spaces and even our bodies. Design is a critical form of human interaction.
The word design comes from the 16th-century Latin verb designare. Although, it has Middle French (desseign) and Italian (disegnare) roots too. Designare is a compound word consisting of de (out) and signare (to mark) and originally meant to mark out. Even though this meaning is not present anymore, we still use its metaphoric extensions. Today, we use design as a synonym of preparing, planning, sketching or fashioning artistically.
We all practice design when we make everyday decisions. This might include when we decide on which table to buy, how we should serve our food or which shirt we pick for a date. We use the word design more deliberately in a professional manner when regarding the process of shaping of what we see and how we interact with it. Designing often necessitates considering the aesthetic, functional, economic and sociopolitical dimensions of both the design object and design process. It may involve considerable research, thought, modeling, interactive adjustment, and re-design.
Since all design work is rooted in a familiar language, practicing one discipline, therefore, means getting better at another. Such is the value of a multidisciplinary background. Our growth in a specific discipline can increase our general design intuition simultaneously.

How does your multidisciplinary background affect your design skill set?
Concerning aesthetics, design is closely related to fine art. However, design’s ultimate goal is to provide theuser usability within the boundaries of a curated experience (more specifically graphic designs, user interfaces, etc.). Design converts emotion into an experience.
It’s also worth noting that since all design work shares the same cultural contexts and conditions at any given time, any design discipline is inherently affected by another. The designed world will always influence the designers which inhabit it. Ideally, designs of various disciplines should work together flawlessly to form a single curated experience. Understanding these connections could be essential.

My Multidisciplinary Design Background

For the designer, the act of design is so natural that most of the time we aren’t conscious of it. If I were asked “When did I start designing?”, I’m not sure that I could answer accurately. Many of us began in drawing, building and imagining as little children.
At some point, we define design practice as a professional discipline. In early schooling, I began with simple image editing, typography experiments, and web design, although all on a relatively low level. The same continued in high school with the addition of illustration and game design in my later years. Up until this point, I hadn’t put much serious thought into my work. It was natural, and artistic, but never really for any purpose.
Everything changed when I started my architectural design education. I learned about a true design process, the importance of concept and research, and that there are always endless design solutions for a problem. During my time, I became familiar with architectural, interior and urban design, and also improved my typographic and graphic skills. Here did I learn that how one presents a design can be just as important as the design itself.
Even though I studied architecture, I started experimenting with professional graphic design in early 2014. I took my entrance working on assets and illustrations, then got my hands on bigger scale projects of identity design, branding, and UI design at the end of the summer. Later, in 2015 I started doing UX design more and more frequently, and I ended up being the UI + UX design guy for many projects.

The Common Languages of Design


Only once I started my professional career did I realize how similar some aspects of these different disciplines are. There are corresponding elements throughout all the fields that—once learned properly—can develop an understanding of entirely new disciplines, and deepen the knowledge of existing ones. These elements include: the design process, such as research, conceptualizing, drafting, prototyping, redesigning, presenting, and so on. The more disciplines that you practise, you will better understand the core mechanics of them in a general sense.

Different design tools come from different disciplines.
There are also elements which can’t connect to any particular field, but to design in general. I’m talking about things like layout, contrast, and pattern. They are present in all design fields and serve as the tools we use to emphasize aspects of our design. We encounter them regularly in every creative process. Since they are always around, we shall deeply understand them. Neglecting or misusing them can be a real curse, while using them properly is a great strength.
I first realized how design knowledge accumulates when working on a runner game in early 2014. It went much smoother than I had expected, and I could also document the process very efficiently. Since my game design experience has never been too developed, I learned a lot of new things along the way, but I could also use the experience I gathered on different fields like graphic design, typography, branding, color selection and interface design. My initial fears evaporated as I realized that I already had the tools to solve the puzzle. This process is similar to what coders encounter: understanding the behavior and logic of a single language also develops a perspective and helps the understanding of others. Even though many things can differ between these languages, the concept is basically the same.

The Universal Design Process

There is a broad disagreement going on concerning what the ideal design process should be. Kees Dorst and Judith Dijkhuis agreed that “there are many ways of describing design processes” and discussed “two basic and fundamentally different ways”— the rational model and the evolutionary model. Although these models have their differences, their main role is to define the process of design and thus they can be used as the most fundamental bridge between disciplines.

The Rational Model

The rational model views the design process as a plan-driven, sequential progress through distinct stages. Here design is informed by research and knowledge in a controlled manner. The stages are pre-production design, design during production, post-production design and redesign, and consist of several smaller processes. The problem with this model is that most of the time designers don’t work this way, and assumptions could also be unrealistic as goals and requirements could shift as the design process goes on.
Although used rather rarely, this method acts as a base for many other design processes throughout the disciplines such as the waterfall model, systems development life cycle and much of the engineering design literature.


The Evolutionary Model

The evolutionary model is a more spontaneous approach consisting of many interrelated concepts. It posits that design is improvised without a defined sequence of stages—different stages of the process (analysis, design, and implementation) are all contemporary. Designers here use creativity and emotion to generate design possibilities. This model also sees design as informed by research and knowledge (just as the rational model), but these are brought into the design process through the judgment and common sense of the designer. Since this method is not hard-coded in term of stage order, it’s present in almost all of the disciplines. It’s basically a paradigm of how we design nowadays, and once we get the hang of it, it can be applied in any design process—making it the cornerstone of exploring new fields.

How Multidisciplinary Design Improved My Skills

As I already mentioned, I was an amateur designer when I started university. I had no idea what a design process was, what should I look out for, or what to focus on. Our group’s first design task was to create three solid 5” cubes out of different materials. I chose two kinds of cardboard and gypsum as the materials and focused on shaping the cube as precisely as possible. It was only later in the class when I realized how else this task could have been handled. People made cubes out of layered glass, smaller wooden cubes or even metal planes. A girl from Kalocsa made her cube out of paprika—a nice homage to her hometown, where first records about the cultivation of paprika originate.
As my education continued, I learned what abstraction and concept meant in a design context. I prefer to make designs with straight-forward messages, sharp shapes, and high contrast. As a designer, to learn the merits of abstraction, and appropriately employ them can be a lifelong process. I’m still finding myself learning new things with new projects.
Abstraction is a really handy tool in the designer’s palette. To make something less in volume, density or complexity while communicating the same message is the way how the design of user interfaces and user experiences work today. Abstraction can also be about forming experiences or messages beyond the surface of perception. As well, communicating these messages with greater accessibility is essential in reaching bigger audiences. It’s also useful when designing new interfaces, logos, icons or any product due to the perspective of simplification it provides. As Ludwig Mies van der Rohe once said: “Less is more.”
My multi-disciplinary background also taught me that all sub-sections of a design should be equal. Much like how the elements of machine system determine the greater systems performance, the sum of the parts of a product also determines the quality of the holistic design. Therefore, it’s critical to provide respect the time required to develop all details carefully. In architecture even the tiniest of design mistakes can have a fatal outcome. A hole in the waterproofing, a slightly miscalculated steel value in a reinforced concrete structure or not knowing how some elements would change over time can ruin the whole design. The same goes for other fields of design. While they are not as fatal as a collapsing building, they can still implode a business.
Creating a logo without any concept, based on only current design trends could be such an issue for instance. A brand, whose logo, colors or style changes every other year is not providing enough time for its users to learn and recognize it. A good designer takes care of every aspect, every single little detail of the logo—things like brand history, target audience, message or placement. Mies also said “God is in the details”. This expresses the idea that whatever one does should be done thoroughly, and this describes the optimal design process very accurately.

The Importance of Design Research and Presentation

When we create new things or come up with a new concept, there is a probability that it has been either entirely or partially done by someone else. Looking for, and finding these examples can help our decision-making process and provide us with conductive experiences we can implement. Learning from others’ mistakes can also be helpful.
Designing something beautiful and thorough doesn’t always grant success. How one presents the product is just as important. Through my first semesters, I wasn’t really bothered about the presentation of my concepts. I spent very little time on the actual style of my presentations, but instead almost all of my time on the concept. Architecture, however, is a profession where you have to convince the client. You have to communicate in every possible channel that your solution is the perfect one. Presentation—as a channel—is a new opportunity to prove yourself and extend your concepts. To be able to serve your design in an appetizing manner, you must develop the skills to build a great presentation. These can include typography, color choice or composition—basically all graphic design skills that are also present in almost all other design disciplines. Being able to design good products and sell it as well can be a deadly combo.


You Don’t Need to Practice Everything

Knowing different disciplines doesn’t always mean that the designer needs to practice them all. Understanding their rules and how they function can be, in most cases, just as good. When designing a mobile interface, for instance, the designer should be aware of the design principles and usage rules of both the device and the platform, yet they don’t have to have past product designer experience to achieve a beautiful and fun UI. Having an idea about how things interact and when it is—and when it is not—necessary to know them in detail could be really helpful in all scenarios.

The Role of the Designer

When discussing designers, most people see them as design professionals with strong factual and procedural knowledge. Accurate knowledge refers to the essential elements that the designer must know to be acquainted with a discipline or solve problems in it: the knowledge of terminology and specific details and elements. Procedural knowledge is about how to do something such as subject-specific skills and methods, and also the knowledge of criteria for determining when to use appropriate procedures.
While this is true, designers also need to know the interrelationships among the basic elements within a larger structure (a single discipline, design in general, etc.) that enable them to function together (i.e. classifications, categories, principles, theories, models, structures) also known as conceptual knowledge. This knowledge is part of the common language of design as most of the areas it covers are easily translated between disciplines. Embracing the above concept can make the designer to be more aware of the whole design scene and can help transitioning between all disciplines more easily.

Conclusion

Design thinking is as old as human consciousness. We can explore and experience it, but it will always be able to reinvent itself and provide us with exciting new things. Being a designer means being able to explore, adapt and invent, and this starts with the understanding of the connections between the disciplines. “Exploration is the engine that drives innovation” as Edith Widder once said.


This article is originally posted here.

About Author

PETER VARADI

Monday, 18 July 2016

Online resource for learning Axure RP Tool

Axure has become one of the high demanding tools for creating High fidelity wireframes & prototypes by designers. Axure RP is a wireframing, rapid prototyping, documentation and specification software tool aimed at web and desktop applications. It offers drag and drop placement, resizing, and formatting of widgets. There are some good online places  to learn Axure tool to increase your hands on & increase your proficiency. List is given below,





1. Axure - Training & Support
Type: Support
http://www.axure.com/support

2. UX Design Tools: Axure
Type: Online course
https://www.lynda.com/Web-User-Experience-tutorials/UX-Design-Tools-Axure/157028-2.html

3. Mastering Axure RP 7 : UX Design Prototyping
Type: Online course
https://www.udemy.com/mastering-axure-rp-7-from-theory-to-practice/

4. Axure RP Pro 7 for Total Beginners
Type: Online course
https://www.udemy.com/axure-rp-pro-for-total-beginners/

5. Axure RP Pro 7 For Wireframes
Type: Online course
https://www.udemy.com/axure-rp-pro-for-wireframes/

6. Learning Axure RP
Type: Online course
https://www.udemy.com/learning-axure-rp/

7. Axure RP - Official Video channel
Type: Video channel
https://www.youtube.com/user/axurerp/featured

Saturday, 9 July 2016

UX Testing For The Masses: Keep It Simple And Cost Effective

User experience design (UXD or UED) is the process of enhancing user satisfaction by improving the usability, accessibility, and pleasure provided in the interaction between the user and the product. This nicely encapsulates what the design part is all about, but what about the other equally important facet of UX, the testing process? The former can be self-taught, at least to a degree. The latter can be considered as one of the more misunderstood, but ultimately necessary steps in UX design. It has to be effective and involve the most important people – your users/customers. For the UX guru-in-training, testing can be a difficult and overwhelming topic to approach initially, due to its sheer scale and the diverse directions it can take. This can sometimes be confusing and misleading, depending on which area you wish to focus on and what your professional background is. For the sake of this article, we’ll approach UX testing from the aspect of a web/app designer who wishes to extend their UI design skills and better understand the core User Centered Design (UCD) approach to an application that should take place before Photoshop or Axure are even powered up.

Understanding User Centered Design (UCD)

Before we proceed to testing, let’s start by explaining the basic concept behind UCD. UCD places the user first in the design and development cycle of an application/website. UCD is based around an understanding of the application’s environment, tasks, and its users. It then addresses the complete user experience as a whole. What this basically means is that the entire design process involves real users throughout, in order to ensure the end product meets its initial brief requirement as fully as possible. To sum up the process in its most basic form (there are many variations of UCD), the following phases are as follows:
·         Context of use: Identify who will use the product and what they will use it for, and under what conditions they intend to use it.
·         Requirements: Identify any business requirements or user goals that must be met for the product to be successful.
·         Design solutions: This part of the process may be done in stages, building from a rough concept to a complete design through a number of iterations.
·         Evaluation of designs: Ideally through usability testing with actual users. This step is just as important for UCD as quality testing is to good software development.
Some of the techniques and methods used in UCD are:

Card Sorting

Card sorting can offer useful insight at the UX Design/Design stage. Card sorting involves participants being given an unsorted group of cards, each card has a statement on it relating to a page or section of the website. The participants are then asked to sort the cards into groups and name them.

Card sorting is a simple and effective way of testing your UX designs on a range of different subjects.

This is usually a great way of learning what your website navigation and content structure should look like, and how they should work in a way that’s logical to your intended user base.

Usability Testing Session

A usability testing session involves collecting data from a group as they use the website/interactive prototypes. It usually comes at a relatively high cost, because it involves a lot of human interaction and legwork.
What does a usability testing session look like? People are invited to attend a session during which they will be asked to perform a series of tasks on the website, while you or the moderator takes notes. The user will often be asked to fill in a questionnaire at the end of the test, to ascertain how difficult it was to perform certain tasks, such as buy a product on an e-commerce site from a specific category page and proceed to checkout.
This type of testing is usually reserved for high-end interactive prototypes or interactive wireframes. It is a great way of gathering data on the most common issues real-world users will encounter.

Focus Groups

Focus group testing is more or less self-explanatory. It involves asking focus group members (which could be site users or the intended target audience) a series of questions related to the website, and being encouraged to share their thoughts and feelings on different related areas of the site design/wireframes.

UX tests involving user groups and questionnaires can cover a broad demographic, but both come with trade-offs.

It’s normally a good idea to have an experienced moderator during such a group session to ensure accurate notes are taken. Additionally, a good moderator should be able to identify the telltale signs of groupthink, and make sure that the whole process is not negatively affected by group dynamics.

Questionnaires

Questionnaires can be a great way of generating invaluable solid statistical data – providing the right questions are asked.
A questionnaire can be particularly useful when you want to collect a much more varied cross-section of data than could be achieved through a small focus group. It can also be argued that people tend to be more honest without the immediate pressure of being in a small user group.
The risk of groupthink is averted, so individuals will make their own decisions.

Testing on a Tight Budget or Timescale

Don’t worry, none of these processes are set in stone. In case you are forced to operate on a tight budget or cut corners to meet a hard deadline, there are ways of streamlining the process without sacrificing too much.

If you have to UX test on a tight budget or on short notice, you will have to cut corners and think outside the box.

For example, you could organize part of these processes differently, or merge them together and use your friends and family as test subjects if needs be. What is important is that you are actively seeking involvement, feedback, and constructive criticism on the processes you design from other people.
If your budget and schedule won’t allow you to do everything you had in mind, you need to think outside the box and come up with new ways of obtaining usable test results. While this approach involves some tradeoffs, you should still be able to get a lot of actionable information from your test subjects.

UX Testing Methods for Beginners

So you’ve researched, planned, strategized and implemented a working website/landing page/app. But how do you know it is actually fulfilling its potential and justifying all the hours of research? All those questionnaires and card sorting, all your effort and money spent? How do we quantify the results of UX testing and research? Here are a few useful services that are essential for UX testing at all levels. Some of these services are free, while others are not. Either way, the following tools are invaluable for gathering real data on your website.

Crazy Egg


Crazy Egg allows you to find out how users are using your website and where they are clicking. The service is not free but offers a great 30-day free trial. If your piggy bank is empty and you’re running out of time, you can at least use the trial period to polish one project.
In my opinion, it is well worth signing up and trying a few websites to get great insight into what clients are doing on your website. Crazy Egg utilizes heatmaps to show you where all the action takes place on your site, allowing you to find out what works and what doesn’t.
Heatmaps tend to be an invaluable addition to the UX design process. In this context, we are talking aboutmousetracking heatmaps rather than eyetracking heatmaps, which are far more advanced and not as easy to come by. Most designers, especially freelancers and designers working for small businesses with limited budgets, are likely to be restricted to moustracking heatmaps. While eyetracking heatmaps can give a lot more insight into how users perceive your site before they take action, they simply aren’t an option for most designers and developers.

Optimizely



Optimizely allows you to conduct effective and in-depth A/B testing, yet it’s relatively easy to use.
A/B testing involves comparing two versions of a page to find out which one performs better. Two pages are shown to similar visitors at the same time, and the page with the better conversion rate is the more effective page.
A/B testing can sometimes mean the difference between a campaign’s failure and success.
The downside? Optimizely is not free, although you can use the Starter plan free of charge. However, this free plan lacks a lot of features compared to the Enterprise plan. Pricing may be a problem for independent designers and small outfits.

Google Analytics


A service that hardly needs an introduction, Google Analytics is one of the most in-depth tools available and is currently the most widely used web analytics service in the world. In a nutshell, Google Analytics allows you to do click testing and drop off points.
Integrated with Adwords, it allows you to track landing page conversions (from ad clicks) and view in-depth information about your website’s traffic.
Google is constantly improving the service and tends to add new features on a regular basis. For example, it recently introduced Data Studio 360, which is an elaborate data visualization and reporting platform designed for enterprise users. It was soon joined by a free version of Data Studio, designed for individuals and small companies.

Measuring Success

Measuring Success

With an effective UCD approach, all results from the above tools and approaches will allow you to set realistic goals to improve your website and user experience. Acting on the feedback from drop-offs, user complaints, and A/B testing can lead to:
·         Increased website traffic.
·         Increased sales/performance.
·         Increased return visitors.
·         Improved usability and ease of use of your website.
·         Reduced future development costs.



Go full circle with your UX tests. Incorporate your findings in your project and re-test when possible.
Truly effective websites are not only concerned with how easy it is to perform tasks accurately and quickly, but also how enjoyable the user experience is. A good user experience should encourage return business.
With website development, you rarely (if ever) get it right first time around. That’s why it’s vital to set aside time and resources for research and subsequent testing. While both require planning and resources, they can make a big difference on the outcome of your project, and therefore tend to be a worthwhile investment.

Taking Things a Step Further

There has been much written over the last decade or so about the importance of UX testing and usability, and it can be a difficult subject.
If you are just getting started, I would definitely recommend attending a seminar or course in your area (hopefully your employer will see the value and can pay for it!). Thankfully, as interest in UX is picking up, there is also an increasing number of great free resources, and many of them are geared towards the beginner UX designer.

UX Testing Websites and Blogs

Here are a few valuable online sources of information and inspiration:
·         UserTesting
·         The Usability Post
·         UX Booth
·         UX Magazine
·         UX Apprentice
·         MeasuringU
·         Designmodo
·         UX Myths
These resources are more than sufficient to get you started, but if you prefer a more hands-on approach, UX courses and seminars are a good place to take your training to the next level. Naturally, real world projects are the ultimate crucible. They will help you polish your skills and gain a much better understanding of the process from start to finish, and allow you to streamline your UX testing to conserve time and money while obtaining useful results.

This article is originally posted here

About Author

RUARIDH CURRIE