redesign_why

The word 're-design' – If something isn’t broke, why fix it?

The word 're-design'

Recently, I have been looking into visual communication and the role of hierarchy in screen layouts. This stemmed from hearing the word ‘re-design’ far too much over the past few months.

 

I found myself saying – what actually is a re-design?

Coming from a UX background, a 're-design' would relate to an element on a site which has been underperforming and needs looking at in-depth. By this I mean understand the analytics, carry out customer-focused research and collaborate with the wider team to work towards the desired goal.

I was struck by how wrong I was in this situation. In fact, for many organisations, a 're-design' means to start from scratch (yes, really!) – new navigation structure, page layouts, typography, and colour palette.

 

I couldn't help but think why?

  • Why redesign the whole website when you have no evidence to back anything up? How do you know what you're designing?
  • Why create extra work, set unrealistic deadlines and potentially lose customers?
  • Why redesign something just because you feel like it, it will waste so much time and money?

I have so many questions, all starting with, why? I could guarantee that none of the questions above could be backed up with evidence.

[ Blank Stare ].

If you find yourself in a similar situation be sure to ask agnate questions about the reasons behind such a rational decision.

 

How would I deal with a 're-design' brief?

Well, to be honest, I would potentially walk away from the project unless I could shadow users for 2 weeks. I would try to analyse what is actually happening and determine what is the real underlying cause of the problem?

From there I would take a UX focused approach:

  1. Define the Problem(s)
  2. Background Research
  3. Brainstorm, evaluate and choose a solution
  4. Prototype the solution (low fidelity)
  5. Specify requirements (based on the research found from testing the prototype)
  6. Develop/prototype the solutions
  7. Test (Does it meet the requirements?)
  8. Build and test the solution

 

If you have got this far, you're probably thinking 'thank the lord, I'm not going crazy'. Below I have a great example of how you can follow trends and work on your website without starting from scratch.

Apple.com have shown years of consistency without making radical changes.

 

apple-2001

apple.com – 2001
Source: Web Design Museum

---

 

apple_2018

apple.com – 2018
Source: Web Design Museum

---

Each iteration displayed (over 17 years) has the same site structure; a navigation, main promo image, 4 secondary promos and a footer navigation but the visual style has followed the brand development.

 

In Conclusion

If (I hope never) you are given a brief that is to 're-design' the whole website, please ask the most important question:

"What evidence do you have that these requirements will solve the problems?"

[ Blank Stare]

 

There is no need to re-design a full website, so much will be missed and the website will make no progression - ok, it might look better but the UI without key features is pointless. Take a moment to do some background research and define the problem(s) – work into these first and see how your metrics change. The resource is always limited at the best of times, this will save the organisation time, money and stress.

If in doubt, show the example of apple.com above. Their site structure isn't broke, so why fix it?

 

Let me know how you handled the brief, I would love to hear the approach you took.

 

---

 You may also like to read:

Innovation & Tech: The Focus of UI/UX

Should ‘Ghost Buttons’ be busted?

 

Subscribe

 


10 books that will boost your creative knowledge

Today’s lifestyle is so heavily based around digital technology and in reflection neglects the traditional education of reading books. Reading about creativity is one of the best ways to inspire yourself, learn from people’s success or mistakes and develop your own knowledge base.

"No matter how busy you may think you are, you must find time for reading, or surrender yourself to self-chosen ignorance." ~ Confucius

We could not recommend more buying a physical book – not only to build on your knowledge but it keeps your brain healthy! It is so easy to read a blog post, article or passing comments online however the distractions take away the ability to digest everything we have just read. There are so many incredible books out there about creativity, Amazon has a whole library full – we have curated 10 of our favourite books to help get you started on your journey.

1. Personal Creative Branding, by Jurgen Salenbacher


creative book ux

Jurgen Salenbacher explains how our success in exploring change relies on our ability to think creatively.

2. Steal like an Artist: 10 Things nobody told you about being creative, by Austin Kleon

creative book ux

Don't reinvent the wheel – everything has been done before but learn how to give it your personal touch through creativity

3. Jack’s Notebook, by Gregg Fraley

creative book ux

Gregg Fraley is a innovation consultant for some big names. This book is about how he teaches problems solving skills and how to turn ideas into actions.

4. Flow: The Psychology of Optimal Expericence, by Mihaly Csikszentmihalyi

creative book ux

"The way to happiness lies not in mindless hedonism, but in mindful change." New York Times Book Review

5. The Chimp Paradox: The Mind Management Programme to help you achieve success, confidence and happiness, by Prof Steve Peters

creative book ux

An incredible book to help you understand your and others behaviours and actions to life. This is an excellent book for UX designers, it will help you to understand how people may think and how environments can affect the way you think.

6. Think Fast & Slow by Daniel Kahneman

creative books ux

An international bestseller that will change the way you make decisions

7. Creative Confidence by Tom Kelly & David Kelly

creative books ux

This is an award-winning book about unleashing the creativity that lies within each and every one of us.

8. Start with Why, By Simon Sinek

creative books ux

In business, it doesn't matter what you do, it matters WHY you do it.

9. Steve Jobs by Walter Isaacson

 

creative books ux

Well, lets be honest! He is a legend 

10. It’s Not How Good You Are, its How Good You Want to be, By Paul Arden

creative books ux

This is a designers bible for the talented and timid alike to help make the unthinkable thinkable

 

Related Articles:

4 tips to build customer trust

10 twitter accounts that will help land your dream job

Photo by THE 5TH on Unsplash

Custom_illustrations

Custom illustrations are important in UX

Custom illustrations

Web trends 2018, suggest custom illustrations will become increasingly popular in the digital industry, not just as art but as visual information. So many of us are familiar with the phrase – 'a picture is worth a thousand words'

High bounce rates and low customer engagement have proposed an opportunity to use illustrations for not only, catching the users eye, but also as a form of communication.

Did you know, the most recognised meanings of the verb to “illustrate” is:

  • ‘clarity’
  • ’to provide with visual features intended to explain or decorate’
  • ‘to make clear by giving or by serving as an example or instance.

This clearly shows the diverse potential of illustration in UI/UX projects. No matter where the illustrations appear, the basics remain the same:

 

“The aim of illustration is to enlighten, clarify and deliver a message via visual elements.”

 

 

The Details Matter

Highly detailed illustrations are incredible when executed properly. They should be aesthetically pleasing, captivating for the majority of viewers and a functional element within the UI.

The theory behind illustration on websites or apps is to provide the user with a piece of information faster and easier than it could happen with text. If the user does not understand the illustration, there is no reason to have it. The aim is to engage the user and allow strong messages to be translated faster through imagery.

Using illustration in a UI can fulfil multiple user needs, that is why is is so popular in UX. We have listed 5 tips to consider when illustration is applied in the user interface:

  1. Meaningful
  2. Unambiguous
  3. Clarifying
  4. Not overloading the screen
  5. Improve usability

 

Below are some more great examples of custom illustrations on the web.

 

 

Featured on: Awwwards
Website: Inside the head

---

 

Website: Slack

---

 

Author: Adrián San Vicente

---

 

Featured on: Awwwards
Website: Shantell Martin

---

 

Featured on: Muzli

---

 

Project: Conceptual Illustrations - GZH Product Design
Author: Leo Natsume

---

 

 

Project: Codee – friendly web development
Author: Holy Sheep!

---

 

 

You may also like to read:

Innovation & Tech: The Focus of UI/UX

Should ‘Ghost Buttons’ be busted?

 

Subscribe

 


Innovation & Tech: The Focus of UI/UX

When we think about innovation, most of us think about technology. However, across the web there are hundreds of articles about radical innovation pushed by technology. Block chain, computer generated voice, machine learning and AI are just a few.  

Technology is the stimulant for new possibilities, but as UX designers we must analyse how new possibilities can add value to a users’ experience, not draw away from it. With so many business’ practising the the Agile methodology, now is a great time to learn the latest techniques and tools to develop your skillset. 

 

The users’ needs are not only satisfied by form and function, but through experience 

 

In order to get a seamless experience alongside futuristic products the user interface needs to strive for two things; simplicity and clarity. A user should be able to perform a desired task with little effort and distraction as possible. 

Below are a few examples of how UI/UX trends are breaking barriers and expanding on new technology.

 

Project: Innovation
Author: EVS

---------

tesla_UIUX

Project: Tesla Model 3 | User Interface
Author: Michael Cherkashin 

---------

sony_headphones

Project: SOUND
Author: Dennis Schafer

---------

nike_UI

Project: Nike Store
Author: Anton Skvortsov

---------

dimensional UI

Project: Daily Renders: Dimensional UI
Author: Fyn Ng

---------

Summary

Innovation and Technology are constantly moving, it is almost impossible to keep up with every product on the market.

As shown above, a combination of great technology with quality UI helps towards a great all round user experience. Where is the future in technology going? Leave your comments...

 

“The best products don’t focus on features, they focus on clarity.” — Jon Bolt

 

 

-------

You may also like to read:

Navigation UI- 5 Common mistakes designers need to avoid

Should 'Ghost Buttons' be busted?


Banksy-Bomb-Hugger

Even Banksy gets UX wrong

Banksy Exhibition in the Moco Museum, Amsterdam was eye-opening ...

Read the text in the image below

How can Banksy allow typographical errors posted alongside his world famous art?

 

Designs are unforgiving when it comes to human error – especially coming from a world-class phenomenon. It’s the designer’s role to make the user feel confident and in control at all times, not make them feel stupid.

 

banksy_error

 

Take pride in the content you create because content is UX.

We have all been creators of content at some point – our diary, text messages, work emails and social posts. We have also been consumers of content too – news articles, blogs, website content and textbooks.

Content is a huge part of our lives and our need to communicate is paramount.

 

 Content is at the heart of design. Without content, design will have no meaning.

 

If the primary purpose of websites, art exhibitions or services is to deliver valuable content to an audience, we should be designing content-first for the best possible UX.

We often miss the opportunity to validate our UX designs with content insights, instead waiting until the final stages – which is too late.

 

Don’t follow the Banksy error in your work.

 

banksy-ux

 

You may also like to read:

6 UX principles that will guide you to create killer content 

10 Books that will boost your creative knowledge


Interview with design influence – Miguel Casais

Miguel is a founder and designer at Reign Supreme, London – where he aims to champion the helm of creativity. Here is a glimpse of Miguel's work and involvement in the UX design community.

 

1. Can you introduce yourself to our audience?

My name is Miguel and I help create awesome work for awesome people, but for the purpose of this interview: Founder of marketing agency Reign Supreme.

 

2. You have recently set up a business – Can you tell us a little more about it?

In short, we’re a Japanese inspired, purpose-driven agency that helps brands build loyal followings and start their own movements.

I launched the agency mid 2017 out of a frustration for a lack of game-changing creativity, and a conformity for mediocre client service.

We’ve since gone from strength to strength supporting brands in a variety of industries, from beer to technology, and we’re aiming to truly make our mark on the industry this year.

 

3. So, what is your definition of UX?

UX is the intersection between functionality and design. It’s what makes the experience of using technology pleasurable and most importantly practical.

You may have the world’s most useful and ingenious software, but without a great UX design no one will use it.

It is also far more than just a pretty looking layout, it’s the architecture behind the front panel.

 

4. How do you include UX in your design process?

That’s a tough one, I like to think I have an eye for design so I go by my own intuitions, but I imagine that wouldn’t be the case for most people.

We have a rule here at Reign Supreme regarding design, and that’s that everything that comes out of here has to be badass & beautiful. And what that really means is that UX is taken seriously, we want it to be pleasurable for people to look at and functional to use our work.

A good rule of thumb for those without an eye for design, might be to ask for other, non-bias, opinions on how enjoyable the use of the design is.

 

5. What is your favourite research method and how has this helped you make business decisions?

As with all good research methods, we start with Google. However, we also run a discovery meeting that fully dissects the heart of the problem and what we’re here to solve. Our solution is only as good as this initial meeting, so it helps profoundly.

 

6. How do you get feedback from your users? How do you conduct your user research?

Be straight-forward and ask, their feedback helps you improve and in-turn provide better value to them in future. Also, it’s important to separate your ego from the equation. Always be open to criticism and take external points of view on board.

We don’t conduct too much user research, but we’d use focus groups on behalf of our clients.

 

7. How do you put your ideas together? What tools do you use to create?

We express our ideas visually using a magical platform called Powerpoint, but other than that, we use Illustrator and a good old-fashioned notepad.

 

Below are Miguel's go to products for design

LEUCHTTURM1917 Notebook – Dotted Pages

UK – http://amzn.to/2EZelpg
US – http://amzn.to/2G1OmyW

Sony MDR-EX110AP Deep Bass Earphones

UK – http://amzn.to/2mVLiMT
US – http://amzn.to/2G1xfNu

Apple MacBook Pro

UK – http://amzn.to/2DoEFZN
US – http://amzn.to/2EZPq4T

 

Thank you Miguel for sharing your story with our audience at Together Incredible. Follow Reign Supreme on instagram to keep up to date with Miguel's journey.

 

If you would like to become an influencer and share your story, drop us an email info@togetherincredible.com 

 

You may also like to read:

6 UX principles that will guide you to create killer content 

10 Books that will boost your creative knowledge


Should ‘Ghost Buttons’ be busted?

What are ghost buttons?

Ghost buttons are buttons with a coloured border but no colour fill – they have become very common on websites. They have inherited the name ‘ghost’ to describe their transparent image as they often take the background’s appearance.

There is an argument whether or not ghost buttons should be busted.

There are two main advantages of using them:

Style purposes

They work well on minimal or flat designed websites as they give an elegant, subtle feel to the design. Sometimes it’s the best way to add a cutting-edge look to a new or existing website.

Visual hierarchy

Their subtle appearance can give emphasis to other elements on the page. When used well they can help with the visual hierarchy of the design by giving order of importance when there is more than one ‘Call to action’ (CTA) on a page.

 

However, there are several disadvantages of using ghost buttons

 

Ghost buttons have ghost conversion

 

Decreased click through rate

Ghost buttons are popular amongst web designers who love the minimalist look – nice design doesn’t mean good design.

CTA’s need to have a strong visual presence that attracts the user’s attention. The purpose of the button is to guide users to proceed with the desired task flow – so, why make this button subtle?

It has been proven through many tests that ghost buttons are over looked and therefore have a lower click rate. Several A/B tests have found that users recognise solid buttons a lot quicker and easier than ghost buttons.

ConversionXL carried out and A/B test and found a 20% decrease in clicks, based on 10,000 visits when testing the following options:


Ghost Button


Solid Button

 

It is very important to follow best practices rather than follow design trends that don’t help users easily reach their end goal. The call to actions need to encourage user engagement and in return lead to a higher conversion rate.

 

Legibility and Contrast

Ghost buttons come with usability issues. If the button is placed over a busy image without sufficient contrast, it can be difficult for users to read the CTA. If the ghost buttons and typography are both white, placed over an image, there is often a lack of visual hierarchy to engage users which can impact conversion.

Clarity

Animation can often help ghost buttons to stand out a little more on hover however, it still may not be clear that it is a button. Take into consideration your audience and their age because ghost buttons can lead to some unwanted confusion.

The above issue may not seem too drastic but the potential impact on conversions is one that can cost the business a lot of money. Be aware of the possible implications and do not create designs that rely heavily on ghost buttons – it may not be the desired design aesthetics but we equally want to make the same mistakes others have already faced. It is important to test these styles and get real results for your audience.

 

Here are a few things to consider next time you think about ghost buttons:

  1. Use ghost buttons as a secondary CTA
  2. Consider Contrast
  3. Be consistent
  4. A/B test the ghost button vs solid button

 

You may also like to read:

Navigation UI- 5 Common mistakes designers need to avoid

6 UX principles that will guide you to create killer content

 


navigation ui

Navigation UI – 5 common mistakes designers need to avoid

Have you been tasked to design the Navigation bar? We have shared some common mistakes to avoid!

We would consider the navigation as one of the most important features on a website, users depend on it to find their required information.

Studies by Forrester Research suggest that 50% (more or less) of possible sales are lost because users cannot find what they’re looking for and 40% of users don’t return when their first visit had a negative impact.

We have listed 5 common mistakes to avoid when designing the navigation:

 

1. No Highlight indication on an active button

There are still so many websites that fail to highlight the active button on the navigation, don’t be guilty of this! It is essential as a designer to indicate how the UI would look for this on your original designs. Users need visual feedback when interacting with your website or they will have no clue where they are in their task flow.

nike navigation image

For example, Nike use colour contrast and a shape (line) to indicate the active button. This shape is equally important as it takes into consideration accessibility for colour blind users.

 

2. Opacity on selected buttons

Designers often add styles to buttons which are not user friendly, regardless of how good they may look. Some websites use low contrast or decrease opacity to make selected buttons stand out but, this simply confuses the users from recognising where they are in the site hierarchy. Avoid these small mistakes as these could have big effects.

apple navigation image

Can you tell which page the user is on based on the navigation? We are on the ‘support’ page which on apple.com is displayed by dimming the white text to a darker grey. The Navigation is a risky place to use low contrast or opacity, as user may perceive their options to be limited, or waste time trying to work out where they are on the site.

You can use a contrast check software to get the right contrast between button and background. 

 

3. Low Contrast on inactive buttons

We agree that inactive buttons should have a lower contrast however, not so low that the labels are hard to read. Users often refer to low contrast buttons as disabled or ‘not clickable’ so be vigilant when applying this UI to your website.

github navigation image

For example, the search bar text on GitHub looks in active. We would consider this a crucial element on their website and would avoid the low contrast text on this feature.

 

4. The area surrounding the navigation label 

There is white space surrounding a label or navigation button which separates it from other buttons. One mistake designers bypass is making the whole target area clickable; this will help user navigate quicker.

tacobell navigation image

 

5. No hover effects on buttons

It’s a simple win yet, so many websites are without it. Applying a hover effect to your navigation buttons makes them easier to click and lets the users know when their cursor is in a clickable area. Without the hover effect, the users assume they need to hit the actual label to activate the link therefore makes the target area smaller and requires more precision from the user – this is too much effort.

footlocker navigation image

 

In Conclusion

The navigation bar is often the first thing that the users look for to help them reach their end goal. We advise you make your buttons intuitive by taking these common mistakes into consideration.

 

You may also like to read:

6 UX principles that will guide you to create killer content 

50 terms you need to know as a UX designer


blogger

6 UX principles that will guide you to create killer content

UX writer, product copywriter or a content designer (whichever you prefer) is one of the most in-demand skills in the world today. In a sea of competition, brands are beginning to realise just how important content is – if you create valuable content, more people will engage with your brand and in return, make you more money.

Business’ are turning to content in their digital strategy – Social media, blogs, videos and email campaigns – to differentiate themselves from their competitors. The phrase “Killer Content” is being used more in workplaces, but what is content without an audience?

Writing exceptional content with the reader (user) in mind will help you build an audience. I am going to share with you 6 principles that will guide you to create killer content.

 

1. Add value to your content

People want to feel good about themselves, if you can do this you have added value to them. There are 3 key ways to add value to your audience;

  • Entertain –Can you make the reader smile, laugh, be excited or even cry (with happiness of course)? Changing the emotional behaviour will have an impact on the reader and this will add value to your content.
  • Teach or Inspire – It’s a true fact, humans seek to learn new things whether it is news, trending fashion or the latest space rocket launch. By making the user more knowledgeable will add value to their everyday life.
  • Solve a problem – Everyone needs answers at some point. Does your product or service solve a problem? Share this with you audience, you never know what answers people are looking for. It could be product or service that adds value to their lives.

 

2. 80/20 Rule

The title of the blog post, campaign or collection is the most important section of your whole post. Why?

The 80/20 rule suggests that 80% of your results comes from 20% your actions.

  • 80% of people will read your headlines.
  • 20% of those people will read the rest of your content

You may be wondering why? Well, the title is the most read element of your post, campaign or collection, if people aren’t intrigued in the title they aren’t going to read anything else.

Never heard of the 80/20 rule? Learn 50 terms you should know as a UX Designer

 

3. Create content that is clear & concise

It is really important your user is not left confused after reading your content – it is crucial to be clear and concise. I have a perfect example for you; Don’t use ‘discover’ when you mean ‘find’

Take out the words which are not necessary and avoid ambiguity if possible. Being clear is the guide to users receiving a good experience.

 

4. Consistency is Key

This is a key principle in UX design, without it we can’t get far. Consistency is intuitive design, users will learn fast how to interact with your content and eliminate confusion. Content that has been predefined saves time and money.

 

5. Trust your instincts 

Believe in yourself! You never know, someone may fall in love with your style of writing, brand or campaign. Go by the rule of thumb, if it doesn’t sound right, it’s likely your users will feel the same way. 

 

6. Leave readers with questions

By this, I don’t mean write an unfinished post – quite the opposite. What I mean is, include questions that make readers reflect on what they have learnt. An engaged audience hangs on to every word and takes in all you write.

 

content design quote

 

Related Articles:

10 Books that will boost your creative knowledge

10 Twitter accounts that will help land your dream job


Interview with User Experience Design Practitioner – Stavan Himal

1. Can you introduce yourself to our audience?

Hi, first of all, thank you for having me and giving me an opportunity to share my thoughts with an awesome audience. So, I am Stavan Himal, User Experience Design Practitioner from India and currently, based in Barcelona and pursuing my masters’ degree in Interaction Design at Harbour Space University.

 

2. How many years have you been practising UX?

I have been practising UX for last 5 years. It all started when I was pursuing my bachelors in Information and Communication Technology back home in India. We had a subject for User Centred Design and I found it so interesting I started working towards that field.

 

3. So, tell us how interaction design and UX work in conjunction?

I particularly believe that Interaction Design falls under the bigger umbrella of User Experience. To achieve a good user experience, you have to create good interactions. The interactions can be anything from the buttons to motion graphics. If the interaction with the elements is first-class, equally the user experience will be excellent.

We’re entering into the era of ‘Beyond the Screen Interactions’ or ‘Beyond the Screen Experiences’ and I believe that to survive in this era, we must take care of the interactions as much as we take care of the User Experience.

 

4. What is your definition of UX?

It is the experience which people have while using any product or service as well as the overall experience when they’ll leave that product or service.’ If they’re not having good experience, it is obvious that the UX is bad.

 

5. What is your favourite research method and how has this helped you make business decisions?

I would start by observing people in the desired demographic, I never miss a chance to observe people. I analyse their activity and judge how difficult or easy it was for them to perform a particular task.

If I find any problems I would start asking and observing more people. After doing that, I would carry out suitable user research and analysis to come up with a solution to their problem.

6. How do you get feedback from your users? How do you conduct your user research?

Ideally, I perform two types of user testing methods; One is task based where I ask the user to perform some tasks and observe what kind of problems they’re facing to achieve the desired outcome.

Secondly, is to ask them directly for their feedback when they perform and complete their initial interactions with the service I have designed. 

My favourite user research method has always been ‘Observation.’ I believe that most of the time people do not know what kind of difficulties they’re facing in performing actions because they’re habituated to do those tasks. So, I ideally analyse them in the initial phase and then I carry out furthermore User Research Methods.

 

7. How do you put your ideas together? What are your tools to create?

I would always sketch the concept after the problem-solving sessions. From there, I would create low fidelity wireframes which would lead onto high fidelity designs. Then, I would prototype it and test.

I ideally use, Sketch App and Omnigraffle to create the wireframes and for prototypes, I use Framer, Principle or Pixate. The choice of the software depends on the complexity of the prototype. If I am creating a simple prototype which can be done faster, I prefer Pixate whereas for more complex prototypes, I use Framer.

 

Stavan's go to products for design

The Design of everyday things by Dom Norman

UK – http://amzn.to/2BseTSr
US – http://amzn.to/2FdAaBw

 

Ember Temperature Control Mug

UK – http://amzn.to/2GfeXsk
US – http://amzn.to/2DyWaql

 

Beats Studio 3 Wireless Headphones

UK – http://amzn.to/2DHC2Wa
US – http://amzn.to/2Bs7Fhj

 

Thank you Stavan for sharing your story with our audience at Together Incredible. If you would like to become an influencer and share your story, drop us an email  info@togetherincredible.com 

 

You may also like to read:

6 UX principles that will guide you to create killer content 

Interview with design influence – Miguel Casais