Published on March 15, 2016
1. our services usability review www.leendii.com
2. a quick intro a usability review involves examining a website (or mobile app) to ﬁnd usability issues, and proposing solutions to such issues. and to complete this review, three important elements are identiﬁed and used as a reference: the website goals, the typical users of the website, and the important tasks the users perform. and once the important tasks have been identiﬁed, the review starts from the homepage and covers internal pages. the depth and scope of the review can be adjusted.
3. what we ﬁnd some of the typical usability issues we address relate to: - functionality and ﬂow - navigation and information architecture - language, labeling and consistency - layout and visual clarity - mobile usability and touchscreen users - error handling, forms and feedback - performance - calls to action (CTA)
4. how we present the results usability issues that have been identiﬁed are clearly marked on screenshots taken from the website. for each, a short comment explains why it is considered an issue, and a solution is proposed. and solutions are based on user-centered design – they are actionable and aim for tweak rather than complete redesign. and where required, a proposed solution is graphically presented. this is for clariﬁcation purposes only, and does not act as a substitute for graphic design.
5. usability reviews and usability tests reviews and tests are complementary rather than substitutes. and a usability review can uncover many usability issues without having to test any participant. it can quickly cover different sections of a website, scenarios and tasks. a usability review also helps where usability tests can’t solve a particular set of problems. but... and a usability review doesn’t actually tell you how usable a website is, just how usable it should be. a usability review is subjective and doesn’t uncover all the issues. and it cannot provide the critical hard data to support design decisions as usability tests do.
6. a real life example the website of an Argentinian voluntary initiative was reviewed (www.proyectoplatolleno.com.ar). in this presentation, the scope of the usability review is limited to the website's homepage (laptop/desktop and English language version). the website's main goals are: - to present the work, stature and achievements of the initiative - to provide useful information - to involve new volunteers and companies - to receive donations - to increase the number of social followers
7. homepage layout logo and utilities navigation menu jumbotron video information call-to-action 1 partners references call-to-action 2
8. logo and utilities existing interface proposed solution 1 2 3 1. the font size for #lacomidanosetira could be bigger given its importance. where possible, try to avoid small characters (keep to a minimum of 16px). 2. the social media icons could be bigger, as increasing the number of followers on social platforms is one of the website's main goals. the YouTube icon could be updated to the "play" symbol only (see https:// www.youtube.com/yt/brand/using-logo.html). this communicates that the website is well maintained, and so it increases trust amongst users. 3. a language label should be written in the target language (eg. "English" and not "Ingles"). the label referring to the language currently used, could be omitted. it is suggested to locate these labels away from the social media icons, to visually differentiate their goal/use.
9. navigation menu existing interface proposed solution 1 2 3 4 5 6 7 1. "Home" could be omitted and the logo can be used as a link to the homepage. if possible, it's good to reduce the number of menu items (it should be around 7 as a maximum). the English navigation menu is not consistent on all pages/ sections. 2. ideally, dropdown menus should be omitted as they make navigation difﬁcult for users interacting with a touchscreen device (it's possible to implement a separate navigation for touchscreen devices, but it adds complication...). several subsections (e.g. "Replicate" and "FAQ") that are currently under "About Us" could be moved under "Become Involved" (see point 4) - forming a more logical association. 3. the dropdown menu should be omitted and the label could be retitled "Deliveries Done". the subsections "Register" and "Volunteers" could be moved under "Become Involved" (see point 4). 4. "Become Involved" could be added as this is one of the website's main goals. as mentioned previously, it can also include several subsections that are currently located under different areas. 5. "Companies" could be changed to "Partners" to clarify their relation with this Project. 6. "#lacomidanosetira" could be changed to "Testimonials". this is an important section to establish the Project's signiﬁcance and it is hidden. several important testimonials should be shown directly on the homepage. 7. "Press" and "Videos" could be combined into "Media".
10. jumbotron existing interface proposed solution 1 2
11. jumbotron 1.this important area should be used to communicate immediately what this website is about (currently, the user has to scroll "below-the-fold" to watch the video or to ﬁnd more information). the proposed solution consists of a message over an image or graphic. the message (please consider the one shown only as an option) should be short, clear and have an impact. the image or graphic should be representative of the "Proyecto Plato Lleno" initiative (the images currently shown only convey a part of the initiative). the slideshow with auto-timing should be avoided. if there is a need to show more than one image or message in this area, the user should decide when to change it. 2. this text area contains important and positive information but it appears disconnected. part of this information could be integrated with the main message (see above) or could be visually emphasized as shown in the proposed solution.
12. video existing interface 1. a short video is a great idea, but this video should explain more about the initiative. it would be helpful to add a voice-over and to keep the music in the background. before implementation, the new video could be tested with people not familiar with the website, to check their level of understanding (and modiﬁed if required). 1
13. information existing interface 1. there should be consistency in the language used in all the sections. the information under "Our Project" is very important and should be located in the jumbotron area. it should also be emphasized. 2. the "question & answer" section appears disconnected in this area of the homepage, and could instead be included under the "Become Involved" section. once the important information is placed on more suitable areas, this entire section could be omitted and would help the following CTA section stand out. 1 2
14. call-to-action 1 existing interface 1. it would be beneﬁcial to add a call-to-action (CTA) for the volunteers (e.g. "Become a volunteer") because this is one of the website's main goals. the CTAs should also be displayed in English if the website's English version is selected. the CTAs "Registra tu evento" and "Registra tu comedor" could be combined into a single, simpler and more general CTA for companies (the potential partners). this could reduce users doubts and increase the conversion rate. 1
15. partners existing interface 1. by reducing the size of the logos, more companies could be shown in this area. this visual change can increase users trust in the website. for the same reasons (increased trust, establishing authority), adding testimonials would have a positive inﬂuence. a selection of important testimonials could be shown in the area above the partners (colaboradores - language consistency required). 1
16. references & call-to-action 2 existing interface 1. references are good to increase the conviction of the website. in this case, the images don't provide any link, so it's better to present them as badges (size should be reduced) and place them in the footer. 2. this is an important CTA for the volunteers. it is likely to be more effective if increased in size and placed in the area above (as previously indicated). 1 2
17. please visit www.leendii.com and get in touch, we are happy to hear from you a email@example.com @leendiiUX
We invented many of the usability methodologies used in these reviews and have used them for decades, so we know what can be soundly concluded.
In a heuristic evaluation, usability experts review your site’s interface and compare it against accepted usability principles. The analysis results in a ...
Usability-Analyse. Bei einer Usability-Analyse (Expert Review) überprüfen Usability-Experten ein Produkt oder eine Anwendung anhand etablierter Usability ...
Im Shoplupe Usability Expertengutachten analysieren wir Ihren Shop nach der Methode der Heuristischen Evaluation. Im Ergebnis erhalten Sie ein bis zu 90 ...
Conducting a usability review is a great way to evaluate and optimize a web site. Here are the steps you need to take to conduct your own usability review.
Usability Review vom Usabiltiy Experten für Websites, Online Shops und Landingpages. Schnell und kostengünstig die Benutzerführung und Usability testen ...
Find out how to carry out an expert usability review, when they are most useful and some of the pros and cons of the technique.
Wie weit ist Ihr Unternehmen auf steigende Usability-Anforderungen vorbereitet? Im folgenden Selbsttest erfahren Sie mehr.
Im Co-Design mit einem Usability Experten entstehen kreative Shops, die auch funktionieren und verhelfen Ihnen zu einem einzigartigen Shoperlebnis.
Sie stecken mitten im Projekt und brauchen eine unabhängige Meinung zu den von Ihnen entwickelten Inhalten, zur Navigation oder zum UI? Sie möchten eine ...