wikiwand ux superstars
    Marketing Resources

    Learning from the UX Superstars at WikiWand

    Dylan KissaneBy 489 Comments9 Mins Read

    wikiwand ux superstars

    There are some websites I like to visit every day.

    If I’m searching for information, I turn to Google or DuckDuckGo. If I’m taking some downtime, I’ll hit up reddit. I visit Inbound.org, I visit Swiped.com, and I read Copyblogger most days, too.

    But if it’s information, confirmation, or just a fast fact I’m after then there’s one place I’ll head to the same place that tens of millions do every day: Wikipedia.

    I don’t need to tell you about the world’s most extensive and consulted online encyclopedia. You’re probably aware of the many millions of articles (38 million, actually) in hundreds of languages (more than 250, in fact). You probably know it can be edited by anyone and that it isn’t supported by advertising. The money that flows into the Wikipedia coffers comes from donations, sometimes corporate but most likely from the hundreds of millions of visitors who stop by to read, add and edit a Wikipedia page each year.

    Yet there’s a problem with Wikipedia and it is one that is not often discussed: Wikipedia is ugly.

    U-G-L-Y You Ain’t Got No Alibi

    There’s something to be said for ugly sites.

    Craigslist is an ugly site but it works, and it works well. You can find what you’re looking for, you aren’t distracted by flashing graphics or put off by slow loading pages. It’s ugly, but it works.

    The Drudge Report is another ugly site. It’s mostly text links, headlines as anchor text, and a nicely chosen image at the top. A couple of colors but basically balck and white – but why change when you bring in hundreds of millions of page views?

    Wikipedia is another ugly site. Here’s an example to save you clicking off to remind yourself:

    wikipedia screenshot marketing

    There’s a sidebar that is static and links to a whole lot of stuff that you probably won’t use often – do I really need to access tools if I am reading and not editing? There’s a table of contents on the page but as I scroll down this menu disappears and I have to return to the top of the page to find it again. The placement of the table of contents and the fact is it extensive means that a lot of the page is empty space – something between a quarter and a third of the page is just blank space.

    On the bright side, all the information I need is going to be there on the page. The links are easily identified and it’s not difficult to distinguish between internal (Wikipedia) links and external (internet) links. The font is well chosen so it is easy to read on the screen, and the table of contents does give me an idea of what the article includes even if it isn’t all that user-friendly. In short, as I mentioned above, it is ugly but it works.

    But what if it could be pretty and work just as well?

    Here’s the same Wikipedia page rendered using WikiWand.

    wikiwand screenshot marketing

    It’s clean, it’s not wasting space, and it is just as easy to read. That useful table of contents that scrolled away is now a static sidebar that is easy to navigate and is always in sight. Those tools and links that don’t get used all that often? Gone, or at least out of sight.

    If I want to render the same page in a different language I need only click the toolbar at the top, and in this case I have a choice of 86 different languages. I can share the page with a click, I can personalize the page as I like without affecting the user experience of other Wikipedians, and I can search and navigate Wikipedia with a clikc on the magnifying glass or the arrow superimposed on the right of the screen.

    And if I want a beautiful, information rich experience where even the sidebar is dispatched? Just click the hamburger at the top of the table of contents and – voila ­– it’s gone.

    wikiwand screenshot marketing no sidebar

    Now that’s a clean, easy to read, easy to navigate site. It’s Wikipedia but pretty: the same information but a nicer interface. How?

    WikiWand.

    WikiWand

    WikiWand is the brainchild of Lior Grossman and Ilan Lewin. Both were fans of Wikipedia but both were also frustrated with the user experience on the site. Sure, they could find what they were looking for, but it just wasn’t as good as it could be. As the pair explains,

    Wikipedia is the greatest curator of human knowledge, allowing people all around the world to freely access 35 million articles in 288 languages. The only problem? Wikipedia was built 14 years ago – and hasn’t changed much since then.

    In the past decade, web and mobile applications have made huge leaps forward in terms of functionality and user experience – we want to bring those same benefits to your Wikipedia experience.

    And that’s exactly what they did.

    WikiWand is a browser extension that renders Wikipedia pages in the clean style above rather than in Wikipedia’s dated, ugly style. It installs in seconds and is simply set-and-forget. It impacts only Wikipedia pages and, if you are really missing the clunky, old-fashioned Wiki, a simple click can take you back to what you (thought you) were missing.

    WikiWand improves the user experience for visitors to Wikipedia pages in a simple, elegant way, and we’re not the only ones to notice.

    In 2015 the WikiWand team was recognized with a Weeby Award for having the Best User Experience. What’s notable in the case of WikiWand, though, is that they not only earned the award presented by the Webby judging panel but also the People’s Choice Award, too. Yes, this isn’t about a user experience that the experts love and the users don’t; everyone who uses WikiWand identifies that this is a superior UX compared to the standard Wikipedia interface.

    Getting to Best Practice UX

    How is it that WikiWand managed to design such a great UX for their users? It starts, of course, by considering how the user actually engages with Wikipedia, as Lior Grossamn explained to The Next Web:

    We began by researching how people are using Wikipedia on mobile, as opposed to on the Web. We soon found that while people use Wikipedia on the Web for research, learning, work and studying, on mobile they use Wikipedia as a quick reference tool: to get immediate answers, settle disputes between friends, quickly learn about the world around them, and look up information about actors, musicians and movies.

    The next step was envisioning the perfect knowledge-consumption experience for mobile users. Essentially, we were not adapting the WikiWand web interface to mobile, but we were actually creating a new mobile experience altogether. Shrinking the Wikipedia website and wrapping it in a mobile app doesn’t cut it anymore — people prefer a true mobile experience.

    Design and UX became an important driver in how WikiWand was developed, and the team took inspiration from Apple, a company known for its intuitive UX and commitment to elegant design. They told Softpedia:

    Steve Jobs once said: design is not just what it looks and feels like, design is how it works.

    Besides the obvious eye-candy, I think design is extremely important when it comes to the consumption of knowledge. A good design is important so you can quickly find what you’re looking for, a good design allows you to easily read, understand and use the information.

    Yes, learning should be pleasant, but WikiWand’s design is not all about the eye candy. It’s about making it easier to consume knowledge. It’s about providing better readability, comprehension and navigation.

    This philosophy of design, user experience, and access to information is thus central to the crafting of the WikiWand product. Indeed, as WikiWand puts it themselves, “Good design is something that requires a good understanding of users’ needs, a lot of innovation, the willingness to keep improving a design that is seemingly great, and eventually, it requires a lot of effort and many iterations.”

    And so far those iterations are paying off.

    Learning UX from WikiWand

    WikiWand is a great example for anyone seeking to improve their user experience for three key reasons.

    First, the WikiWand team are proof that even the most popular products can be improved if attention is paid to the user experience. They took a product that hundreds of millions of people use daily and which has essentially no significant competition in its encyclopedia space online and found a way to compete. It wasn’t on the basis on product – the information remains the same – but rather experience as that same information was presented more effectively.

    Second, the WikiWand team prove that developing a product with the customer experience as the fundamental stepping off point leads to success. By starting out thinking about the way the customer would like to use Wikipedia instead of thinking about what they can do or would like to do themselves, WikiWand is able to deliver the sort of product that people want to use rather than the product they want to sell.

    Third, WikiWand demonstrates that even where people think they have a nice user experience they might not know what they’re missing. Wikipedia is, after all, free to use, relatively easy to navigate, and simple to search. The beauty of the WikiWand product is that it takes something that works well and is only a little bit frustrating and makes it into something fluid, clean, and smooth. Users didn’t know how bad their experience on the site was until someone came along and showed them how good it could be.

    If you are seeking to move your company or product further, you could do a lot worse than focusing on the experience of your users. And when you turn to focus on UX, you could barely find a better example of great  contemporary UX than WikiWand.

    Got another example of a company with great UX? Let us know your favorites on Twitter!

    Share.

    Related Posts

    View 489 Comments

    489 Comments

    65. http://dachnik-info.ru/ on

      My partner and I stumbled over here different web address and
      thought I might check things out. I like what I see so now i’m following you.
      Look forward to exploring your web page repeatedly.

      Reply
    73. Anonymous on

      You’re so cool! I don’t suppose I have read something like this before. So nice to find someone with a few original thoughts on this topic. Really.. thank you for starting this up. This site is something that is needed on the web, someone with a little originality!

      Reply
    75. rem-dom-stroy.ru on

      Woah! I’m really enjoying the template/theme of this website. It’s simple, yet effective. A lot of times it’s very hard to get that “perfect balance” between superb usability and visual appearance. I must say that you’ve done a amazing job with this. In addition, the blog loads very fast for me on Opera. Outstanding Blog!

      Reply
    77. Anonymous on

      Aw, this was an incredibly nice post. Finding the time and actual effort to produce a very good article but what can I say I procrastinate a lot and never seem to get anything done.

      Reply
    79. obshchestroy.ru on

      Hi, i think that i saw you visited my weblog so i came to return the favor.I am trying to find things to improve my website!I suppose its ok to use some of your ideas!!

      Reply
    82. smartremstroy.ru on

      Hey there! This is kind of off topic but I need some advice from an established blog. Is it hard to set up your own blog? I’m not very techincal but I can figure things out pretty fast. I’m thinking about setting up my own but I’m not sure where to start. Do you have any tips or suggestions? Thank you

      Reply
    85. delaremontnika.ru on

      I don’t even know how I ended up here, but I thought this post was good. I don’t know who you are but definitely you are going to a famous blogger if you are not already 😉 Cheers!

      Reply
    90. nastroyke-info.ru on

      Unquestionably consider that that you stated. Your favourite justification appeared to be at the internet the simplest thing to understand of. I say to you, I definitely get irked even as other people consider worries that they plainly do not realize about. You controlled to hit the nail upon the top as smartlyand also defined out the whole thing with no need side effect , other folks can take a signal. Will likely be back to get more. Thank you

      Reply
    99. infoda4nik.ru on

      Great goods from you, man. I’ve understand your stuff prior to and you’re simply too great. I really like what you’ve acquired here, really like what you’re stating and the best way in which you are saying it. You make it entertaining and you still take care of to stay it sensible. I cant wait to read far more from you. This is actually a terrific site.

      Reply
    102. sadovoe-tut.ru on

      Hi there I am so happy I found your website, I really found you by error, while I was searching on Digg for something else, Regardless I am here now and would just like to say cheers for a incredible post and a all round exciting blog (I also love the theme/design), I dont have time to read through it all at the minute but I have saved it and also included your RSS feeds, so when I have time I will be back to read a lot more, Please do keep up the excellent jo.

      Reply
    134. agrosadovnik.ru on

      Today, I went to the beachfront with my kids. I found a sea shell and gave it to my 4 year old daughter and said “You can hear the ocean if you put this to your ear.” She put the shell to her ear and screamed. There was a hermit crab inside and it pinched her ear. She never wants to go back! LoL I know this is entirely off topic but I had to tell someone!

      Reply
    136. body tape for stomach on

      We are a group of volunteers and starting a new scheme in our community. Your site provided us with valuable information to work on. You have done an impressive job and our whole community will be grateful to you.

      Reply
    143. gateio kimlik doğrulama ne kadar sürer on

      I am a student of BAK College. The recent paper competition gave me a lot of headaches, and I checked a lot of information. Finally, after reading your article, it suddenly dawned on me that I can still have such an idea. grateful. But I still have some questions, hope you can help me.

      Reply
    193. bezogoroda.ru on

      Thank you for the auspicious writeup. It in reality used to be a leisure account it. Glance complex to far brought agreeable from you! By the way, how can we communicate?

      Reply
    225. гостиничные чеки купить спб on

      I loved as much as you will receive carried out right here. The sketch is tasteful, your authored subject matter stylish. nonetheless, you command get bought an impatience over that you wish be delivering the following. unwell unquestionably come further formerly again since exactly the same nearly a lot often inside case you shield this increase.

      Reply
    232. free casino games on

      Its like you read my mind! You seem to understand so much approximately this, like you wrote the guide in it or something. I think that you could do with some p.c. to force the message house a bit, however other than that, this is magnificent blog. A great read. I’ll definitely be back.

      Reply
    234. daachka.ru on

      whoah this blog is fantastic i really like reading your articles. Stay up the good work! You understand, a lot of individuals are searching around for this info, you can help them greatly.

      Reply
    277. Juristide konsultatsioon on

      You can definitely see your expertise in the article you write. The arena hopes for more passionate writers like you who aren’t afraid to mention how they believe. All the time go after your heart.

      Reply
    322. daachnik.ru on

      you are really a just right webmaster. The site loading velocity is incredible. It sort of feels that you are doing any unique trick. Also, The contents are masterpiece. you have performed a great activity in this matter!

      Reply
    324. delaremontnika.ru on

      Hi, I do believe this is an excellent blog. I stumbledupon it 😉 I will come back once again since I bookmarked it. Money and freedom is the best way to change, may you be rich and continue to help other people.

      Reply
    325. daachnik.ru on

      A person necessarily help to make significantly articles I might state. This is the first time I frequented your web page and thus far? I amazed with the research you made to create this actual post amazing. Wonderful process!

      Reply
    328. twitch.tv on

      Appreciating the hard work you put into your site and in depth information you present. It’s great to come across a blog every once in a while that isn’t the same unwanted rehashed material. Excellent read! I’ve saved your site and I’m including your RSS feeds to my Google account.

      Reply
    330. twitch.tv on

      No matter if some one searches for his necessary thing, so he/she needs to be available that in detail, thus that thing is maintained over here.

      Reply
    341. xxx dog tube on

      I believe what you postedtypedbelieve what you postedtypedsaidbelieve what you postedtypedsaidthink what you postedwroteWhat you postedwrote was very logicala bunch of sense. But, what about this?think about this, what if you were to write a killer headlinetitle?content?wrote a catchier title? I ain’t saying your content isn’t good.ain’t saying your content isn’t gooddon’t want to tell you how to run your blog, but what if you added a titlesomethingheadlinetitle that grabbed a person’s attention?maybe get people’s attention?want more? I mean %BLOG_TITLE% is a little vanilla. You could look at Yahoo’s home page and see how they createwrite news headlines to get viewers to click. You might add a related video or a pic or two to get readers interested about what you’ve written. Just my opinion, it could bring your postsblog a little livelier.

      Reply
    350. myinfodacha.ru on

      I’m not sure why but this blog is loading incredibly slow for me. Is anyone else having this issue or is it a problem on my end? I’ll check back later and see if the problem still exists.

      Reply
    354. sadounik.ru on

      Hi, i think that i saw you visited my website so i came to return the favor.I am trying to find things to improve my site!I suppose its ok to use some of your ideas!!

      Reply
    355. sadounik.ru on

      After exploring a number of the blog posts on your website, I really like your way of blogging. I saved it to my bookmark website list and will be checking back soon. Please check out my web site as well and let me know how you feel.

      Reply
    361. daa4a.ru on

      Hi there! I’m at work browsing your blog from my new iphone 3gs! Just wanted to say I love reading your blog and look forward to all your posts! Keep up the fantastic work!

      Reply
    365. xxxx g on

      A person necessarily help to make seriously articles I might state. This is the first time I frequented your web page and to this point? I amazed with the research you made to create this actual post incredible. Magnificent task!

      Reply
    372. ремонт окон on

      Hi there just wanted to give you a quick heads up. The text in your post seem to be running off the screen in Firefox. I’m not sure if this is a format issue or something to do with web browser compatibility but I thought I’d post to let you know. The style and design look great though! Hope you get the problem resolved soon. Kudos

      Reply
    381. xxxx g on

      hi!,I love your writing so much! proportion we keep in touch more approximately your post on AOL? I need an expert in this space to solve my problem. May be that is you! Taking a look forward to peer you.

      Reply
    382. sexy animal video on

      Thanks for one’s marvelous posting! I seriously enjoyed reading it, you may be a great author. I will make certain to bookmark your blog and will often come back later in life. I want to encourage one to continue your great posts, have a nice weekend!

      Reply
    400. sadovoe-tut.ru on

      An impressive share! I have just forwarded this onto a coworker who had been doing a little research on this. And he in fact bought me lunch because I discovered it for him… lol. So let me reword this…. Thank YOU for the meal!! But yeah, thanx for spending time to discuss this matter here on your website.

      Reply
    421. ogorodkino.ru on

      After checking out a few of the blog posts on your web site, I truly like your way of blogging. I bookmarked it to my bookmark site list and will be checking back soon. Please check out my web site as well and let me know how you feel.

      Reply
    423. сделать чек на гостиницу on

      Can I simply say what a relief to discover somebody that truly knows what they’re talking about on the net. You definitely know how to bring an issue to light and make it important. More and more people should read this and understand this side of the story. It’s surprising you’re not more popular because you certainly have the gift.

      Reply
    425. купить чек на гостиницу в москве on

      With havin so much content and articles do you ever run into any problems of plagorism or copyright violation? My site has a lot of completely unique content I’ve either authored myself or outsourced but it appears a lot of it is popping it up all over the web without my agreement. Do you know any methods to help stop content from being ripped off? I’d definitely appreciate it.

      Reply
    443. infoda4nik.ru on

      Hi, Neat post. There is a problem together with your web site in internet explorer, may check this? IE still is the marketplace leader and a large portion of folks will omit your wonderful writing due to this problem.

      Reply
    444. infoda4nik.ru on

      I am curious to find out what blog system you are working with? I’m experiencing some minor security problems with my latest website and I would like to find something more safeguarded. Do you have any solutions?

      Reply
    464. сделать чек на гостиницу on

      I’ve been exploring for a little bit for any high-quality articles or blog posts in this kind of area . Exploring in Yahoo I finally stumbled upon this web site. Reading this info So i’m glad to show that I have a very good uncanny feeling I came upon exactly what I needed. I such a lot without a doubt will make certain to don?t disregard this web site and give it a look on a constant basis.

      Reply
    467. חשפניות on

      Hi there, I think your site could be having internet browser compatibility issues. When I look at your website in Safari, it looks fine but when opening in Internet Explorer, it has some overlapping issues. I simply wanted to give you a quick heads up! Besides that, fantastic blog!

      Reply
    472. חשפניות on

      We are a gaggle of volunteers and starting a new scheme in our community. Your site provided us with useful information to work on. You have performed an impressive process and our whole community will probably be grateful to you.

      Reply
    473. sphynx kitten on

      Unquestionably believe that which you stated. Your favorite justification appeared to be on the internet the simplest thing to be aware of. I say to you, I definitely get irked while people consider worries that they plainly do not know about. You managed to hit the nail upon the top and also defined out the whole thing without having side effect , people can take a signal. Will likely be back to get more. Thanks

      Reply
    474. חשפניות on

      Thank you for some other magnificent article. Where else may anyone get that kind of information in such a perfect way of writing? I have a presentation next week, and I am at the look for such information.

      Reply
    475. חשפניות on

      I have been surfing online more than 3 hours today, yet I never found any interesting article like yours. It’s pretty worth enough for me. In my opinion, if all webmasters and bloggers made good content as you did, the internet will be much more useful than ever before.

      Reply
    476. sphynx kitten on

      Excellent post. I was checking continuously this blog and I am impressed! Very useful information particularly the last part 🙂 I care for such info a lot. I was seeking this particular info for a long time. Thank you and good luck.

      Reply
    477. how much is a sphynx cat on

      I simply could not leave your web site prior to suggesting that I really enjoyed the standard information a person supply in your visitors? Is going to be back incessantly in order to inspect new posts

      Reply
    478. חשפניות on

      Hi! I just wanted to ask if you ever have any problems with hackers? My last blog (wordpress) was hacked and I ended up losing a few months of hard work due to no data backup. Do you have any solutions to prevent hackers?

      Reply
    479. חשפניות on

      I simply could not depart your web site prior to suggesting that I extremely enjoyed the standard information a person supply for your visitors? Is going to be back often in order to check out new posts

      Reply
    480. sphynx kitten on

      I would like to thank you for the efforts you have put in writing this website. I am hoping to see the same high-grade blog posts from you in the future as well. In fact, your creative writing abilities has inspired me to get my very own website now 😉

      Reply
    484. חשפניות on

      I am extremely impressed with your writing skills and also with the layout on your blog. Is this a paid theme or did you customize it yourself? Either way keep up the nice quality writing, it’s rare to see a nice blog like this one nowadays.

      Reply
    488. sphynx cat for sale near me on

      Hey! I know this is kind of off topic but I was wondering if you knew where I could get a captcha plugin for my comment form? I’m using the same blog platform as yours and I’m having difficulty finding one? Thanks a lot!

      Reply

    Leave A Reply