Insightful stories that revolve around technology, culture, and design

All blogs

Topics
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Digital Accessibility Benefits Everyone
Category Items

Digital Accessibility Benefits Everyone

How accessibility improves usability and inclusion for every digital user.
5 min read

As the integration between online and physical grows, digital products are set to transform how everyone from boomers to Gen Z turns into digital natives, connect, shop, work, and play. This has resulted in physical points of sale diminish in many regions. Digital and experiential business strategies are now imperative for brands. People have accepted digital mediums as a way of life and have moved years forward in digital adoption for business. Amazon doubled its profit during a pandemic while the other grocery/online stores have shifted online, banks have transitioned and extended their digital outreach, schools and institutions have taken 100 percent turn towards online learning and digital classrooms, hospitals have aided digital services and business owners are actively developing and executing plans to increase their digital visibility and increase profits and build a more anchored future.

As no one remains untouched by the world growing digitally, brands that care about their users and add that value to the business for the benefit of their users are more likely to survive inclusively. The value doesn't necessarily mean cost and time, in the digital world it is about accessibility when we focus on how experiences can transform brands and change the lives of the users. Digital accessibility benefits everyone. Engaging and empowering people with disabilities has become more important than ever. Accessibility can address true users' needs, forge stronger ties, and is an untapped opportunity for businesses to innovate with web products and services. This blog focuses on digital accessibility shifts, why brands should innovate and reposition themselves with accessibility experiences (AX).

About Accessibility

Digital accessibility is the ability of a website, mobile application or any electronic document to be easily perceived, understood, navigated by a wide range of users, including users with disabilities. Accessible websites and apps benefit everyone, as examples for those using their mobile devices while driving, during slow network connections, parents of kids who are using an app for the first time to attend classes, and people who have newly moved to e-commerce websites for their basic shopping needs. Accessibility benefits everyone.

Most businesses are accelerating their shifts toward digital-first models. 

Why Do We Need Accessibility?

  • According to The World Bank, over 1.3 billion people – 15% of the world's population – live with some form of disability. It is estimated that disabled people and their families control $8 trillion in disposable income globally. This presents a huge untapped opportunity for businesses to innovate with their products and services.
  • According to UsableNet, the newest data on digital accessibility lawsuits shows that web accessibility offers an opportunity to grow your revenue while providing significant value to brands. 
  • The same data shows that in 2020, web, app, and video accessibility cases are up almost 25% year-on-year. December saw an almost 100% rise over January. Total digital accessibility lawsuits in 2020 exceeded 3,500. When you combine federal and state ADA lawsuits, the trend is moving upward.
  • Accessibility lawsuits rose again in 2020, more than 20% compared to 2019.
An image showing data of lawsuits filed for web accessibility. Total digital accessibility lawsuits in 2020 exceeded 3,500.
Image Source - UsableNet
  • According to WebAIM, a staggering 98.1% of homepages from 1m popular websites failed to meet legal accessibility standards in 2020. Some of the inaccessible UX designs include cluttered layouts, poor color contrast, and missing text alternatives for images.
  • As per centers for disease control and prevention people with disabilities make up around 26% of adults in USA. That's a quarter of the population.
  • According to UK-based disability charity Purple, 75% of disabled people have had to leave a store or website, unable to finish a purchase due to their disability.
  • 2019 survey revealed that 69% of disabled online consumers will click away from websites that they find difficult to use, while 86% have chosen to pay more for a product from an accessible website.

Brands That Care About Their Users

To reach a fuller spectrum of inclusivity, some brands are making sure that people with disabilities and everyone who needs accessible web features at some point  are included in the process of research and product development from the very beginning.

  • Teach Access, is an initiative that addresses the accessibility skills gap by offering more learning opportunities for students to design and develop products with the needs of disabled people in mind.
  • Google Lookout uses computer vision to help blind users identify food labels and scan documents.
  • Updated in 2020, Apple's latest version of iOS also added smart features catering to people with hearing and vision impairments.
  • Fable, created an online platform that connects researchers, designers, and developers with people with disabilities.
  • In 2019, Microsoft rolled out Immersive Reader for VR, which is designed to help people with ADHD, autism, dyslexia, or visual impairments to focus while reading.
  • WalkinVR is a new software program that makes VR games more accessible for the disabled.
  • Tesco redesigned its grocery app with accessibility baked in from the beginning.
  • New tools such as Cards for Humanity aim to help people design more inclusively, in this case with an online card game.
A screenshot of a card game based website specially designed with accessible features


In Conclusion

The pandemic has put into perspective the fragility of experiences, the importance of communication, and the need for a more holistic relationship between people and digital. Living in an era of infodemic lately, we have seen positive and negative impacts of digital products. We have seen shutdowns causing human connections to change touch base.

At the dawn of a digital economy, accessibility experience (AX) can enhance the user journey and thoughtfully designed websites and apps with empowering solutions pave the way for a more inclusive world.

AX helps to translate a brand as empathetic and caring for their users, creating more connections and helping more users get their work done online easily. It helps to build a brand image by creating a digital environment that truly resonates with people. Accessibility is the differentiator that we need for the future. Accessibility should not be an afterthought and businesses that strive to integrate accessibility while reacting quickly to the people's needs in a time of crisis are the ones that thrive. 

Hopefully, the purpose is clear that we need accessible digital experiences created with a mission and vision to create inclusive designs and to establish brands that are fair, honest, ethical, human, creative, and sustainable. It's not complicated, it's simple. It's not a constraint, digital accessibility is the aesthetic we need, it's a design element that makes a digital experience beautiful.

User Research enables Design with Shivani Aurora
Category Items

User Research enables Design with Shivani Aurora

Shivani Aurora discusses how user research shapes effective, empathetic design outcomes.
5 min read

Designwise Episode 1

"Research is an extraordinary process that enables functioning and an understanding between the people and the creators. It allows us to rehearse it and, in the process, also helps us to deploy it".

Research is a medium to understand the evolving needs of the people. Brands must focus on research to win minds and market share, well not just that! There is more to it, experienced creatives are actively using user research to shift perceptions and encourage empathy. The hope is to increase the understanding of people to address their true needs.

Our first episode of "designwise" is a real, raw, and honest design conversation with Shivani. From the experience of being a designer for over twelve years, She tells us about, how do designers advocate the need for user research? How does user research address business needs? and why should we all adopt user research as a groundwork for every design process? Let's Listen!

 

"Being a product designer my work definitely fits inside those digital screens but every action is so much more related to those real-world emotions and what exactly user experience is and It sounds really cliché, but the ability to impact other people's lives and make it easier is so much more gratifying and I truly love it".

— Shivani Aurora.

 

Subscribe to Designwise on Apple Podcast or Spotify

Transcript

Priyanka: Welcome to QED42's podcast Designwise, I'm your host, Priyanka Jeph, and I'm a design writer at QED42. This is the first episode of our podcast and our guest today, Shivani Aurora, who's a product designer at Workday as of now, has led various aspects of design, starting from research, strategy, interaction to visual design and today she'll be talking to us in detail about user research and how to apply research to business needs. We'll also talk about the need for user research, for a good digital experience and what it means to her as a designer. It is a pleasure and I'm really excited to create the very first designwise podcast with Shivani, Hi! Shivani, Welcome to Designwise.

Priyanka: I'm absolutely looking forward to this conversation because, you know, we go a long way since 2005 and also because I loved our pre-recording conversations about how important design is, the value of user research in the process of design, and I'm sure our audiences are going to learn a lot from you. So having said that, how are you?

Shivani: Thank you so much, Priyanka. I am doing very well. I hope you are doing well, too.

Priyanka: I'm good as well. So, ya, let's begin with your experience with design. How has it been with you over all these years?

Shivani: Yes, sure, I can give you a little quick introduction about myself, so I am a product designer working at a company called Workday in California. Before that, I was working at a design agency in San Francisco for last three years. I would say an experience, I think, which was very varied because I was working for different clients, different company sizes, but equally rewarding. And before that, I was doing my masters in digital media editing, which I did a year-long fellowship at Microsoft as a civic tech fellow. Again, a very interesting experience. I think I think that's pretty much been my recent stint.

Priyanka: That has been a very interesting journey, what, what I would like to know more is how design has added value to all these yours and what does it mean to you?

Shivani: A big question I feel, though, well design, I feel to me is having like an incredible power that I think can touch and impact, people's lives in so many different ways. Right. And I feel my role or anybody's role as a designer today is so much more important than ever before because every aspect of our lives today is so deeply connected digitally. I mean, what other way to see the impact and the power than this unfortunate pandemic that we are experiencing right now? I feel my mom, who has never, ever used an app for shopping, is now ordering groceries online. She's having literally Zoom Sessions and she's celebrating birthdays virtually, which I feel all of these moments for somebody like her or anybody her age could be really defeating and tiring you know if that digital experience or interaction is hard for someone and beat her or anybody of any other age or experience, I feel like, at least for me as being a product designer, like my work definitely fits inside those digital screens, but every action that it affords is so much more related to these real world emotions. And what is that user experience is at that point in time? And I mean, it sounds really cliche, but just the ability to impact people's lives and make it easier, I feel is so much more gratifying and I truly love it.

Priyanka: This is so seamlessly explained the point,

Priyanka: That design has a huge impact on humans and it's a gratifying experience for designers themselves to create products like that. What I would like to know more is how do you add those aspects of design in the products that you create?

Shivani: I think one of the things that I feel differentiates you as a good designer is you've got to have that passion to really wanting to understand what users want, like understand what their motivations are and what are they looking for when they're trying to complete a task or anything, for that matter. And for me personally, I feel like my design process is deeply rooted and connected with user research. And it's something that I call my superpower because I feel that is something that keeps me connected to thinking about what is it that users want and then build a meaningful experience around it. So throughout my process, like it's not just including research in that specific stage, maybe early on or later in the stage, but it's really working around. That needs of the user throughout the process is something that connects me to that human experience and real emotion of that user. And what, what does it create at the end of the day and how has it impacted them is what is how I think about it?

Priyanka: I absolutely agree. We do this for the people at the end-user, as it said. But it's a known fact that not every company invests in research as much as they should. How do you think designers can help advocate the need for it? Do you really, you know, do they really need to advocate the need for it?

Shivani: Yeah, I mean, that's that's a sad fact. But I mean, I live in the Bay Area, the tech, tech giant space. But I still have had my experiences where companies still think that you know, research would be a waste of time and money or maybe that it should be done just at a specific stage and not throughout the process. And I feel as a designer, as much time we spend designing and spending time on screens creating these experiences, I think it's equally important to also evangelize within our organizations on what we do and why we do own it. It sounds simple, but I think it's amazing how many people do not know what exact role do we play. And, and for research specifically, I feel like, you know, as designers, we are the voice of the users. So to convince the stakeholders on the impact that this research can really have is something that can really be helpful. And so I think it really depends at the end of the day, like who your audience is and who are you trying to convince. But I mean, it can be as simple as like just creating a presentation with, you know, real-world examples of case studies or show what you did in your previous company and how, how it impacted the business or get them a true story or,or.

Shivani: I mean, I've I've also done this like where you have super low budget constraints. And, you know, if you end-user, is somebody like your friends do fit into that user base. I have also connected like free coffee sessions where I, I just did like some impromptu research sessions and. Showed that of how that would create a true value and how it would actually impact the business at the end of the day. I think you just need to be creative and adapt. But what you should not do, I think, is just not compromise and not reach out to the end-user, is what I would say. So it just depends on how you bridge that gap by thinking about how this new experience we're designing and how we are going to not just fulfil the goal of the end-user, but also how it'll impact the business need at the end of the day.

Priyanka: Exactly that exactly what I was going to come to from the experiences you've had, how do you think we can explain the need of user research to the stakeholders, the decision-makers, while also addressing the business needs?

Shivani: Yeah, I think my experience, like working in an agency, was in a different way. You're like all you could do is, of course, convince you cannot always impact the end decision what the client would take. But the one thing that has worked for me being in an agency or an in-house company, that you still are trying to convince the business stakeholders. The one thing that I found is see there, there are two kinds of audiences here. Again, like if I'm thinking just about the business stakeholders, what they are concerned, you have to understand what their language is, what their motivations is. And this is, again, understanding your audience, which is the business leaders of this case, and they want to be convinced about, OK, how is this going to impact subscription and say they want you to increase the subscription by 10 per cent and this is what they care about.

Shivani: But if you as a designer said that as a goal, I think it starts on a very wrong note. You know, you can just force a subscription screen on the landing page and. Yes, and the experience will not be great, but it will increase the subscription by 10 per cent. Right. But it will not create a great user experience.

Shivani: So I think the one way that I have been looking at it is first identifying what is.

Shivani: The UX outcome that I'm looking at, so say, yes, I'm going to create a subscription experience on the landing page, but maybe I need to think about how will it actually impact the customer's experience? And I think I can give an example of how I think about it. So there is a company here called Everlane, which is really concerned, and they make these products which really impact how the climate change is happening. And I'm imagining so if I'm designing for a company like Everlane, I might think and propose when I'm giving this sign up screen that, hey, every sign up that you do, but not just going to send you deals, but will also tell you how every product that we make or how we are impacting or doing something good for the climate change and we might send you updates. So in a way, I'm like, OK, I'm concerned about climate change. Yes, I will sign up and let's see if the company is actually doing something because everybody says we're doing stuff, but you don't really know what's happening or how much you're donating and what you're actually doing. So I would be convinced to actually sign up here. And if I actually find that they're actually doing a great job, I might be the word of mouth spread this and at the end of the day, there will be more people coming in and shopping at your site because they believe in the value that you're creating. So I feel this would be an example of how I am creating a value outcome, a UX outcome by giving this messaging. But at the end of the day, it's actually going to bring in more users, which will increase the subscription, which is what the business is more concerned about. So I think I would just say that as designers, we need to keep the focus on what the user wants, but be able to connect the dots between that improved user experience and how it will help us attain a better business result.

Shivani: And time and again, I think I definitely have found this really valuable in my experience, and this is something that I would suggest.

Priyanka: Absolutely. Shivani Absolutely. User research is what makes the product. What it is going further, Do you think designers can play an active role as researchers or it should be a separate practice in itself?

Shivani: Yeah, and I think this is an experience that is very close to my heart because the last company I was talking about, I've seen first hand how you know we used to work as two different teams of researchers and designers. And and even if you're not in a model there, I think generally you find that researchers and designers are different in ratio. A researcher might work on a project and move on to the other one.

Shivani: But by the time you start acting on those research insights, the researcher might be working on something else. But I feel.

Shivani: As equal, equally important, it is for us to have that collaborative environment with engineers or product managers, which we often do in the process, but it is equally important to bring those researchers back in the process because, you know, when they're actually conducting those say user interviews, where they're listening to the users, there are so many nuances around it. Like there's so much there's so much context when they're actually having that conversation with the user that is really valuable. And sometimes if you just fix fixate your ideas on what the research report or those like 10 liners are telling you, you might miss out something. I mean, you wouldn't always. But you may. So just bringing those researchers back in the process and say, hey, you know what? Just look at the process or I mean, even if the work is in progress. Just ask them to take a look at your work and I'm sure you'll get insights or they might give you feedback on stuff that you might have missed out.

Shivani: And I've always found that really valuable. The other thing I always do, again, I think that relationship is really important, that as designers, we could also be a little bit proactive. So, you know, when the researchers are conducting these sessions, what you could do is just listen to those recordings or maybe it doesn't have to be lively. Like you could just sit and go live and that would be awesome. But if not, you can just go back and listen to the recording sessions.

Shivani: I think those those listening to those uses first hand, I have always found it to be extremely valuable. It paints a bigger picture than you can imagine, and it's always helpful.

Shivani: And I think, again, even if you don't have a research team, I would say you can start with something like, you know, just go out and talk to people who are talking to the customer care like customer care team whos is actually talking to the users. I mean, there's so much insights you have there. I feel like even if you don't have research dedicated researchers in the team, they'd be the one researcher like to do those tasks, look into the data, try and dig in what's happening to see what users are saying, go out in the field and just talk to them and you will be surprised how much you just learn from those simple processes. And the key is just to like you know make sure that your complete design process is revolving around the users. And I think that is that is that is the only biggest advice I think I will give at this point.

Priyanka: Having said that, our audiences are going to learn a lot from you, what you just said, you know, and user research is extremely important as designers, you know, designers ought to do it. They need to step up and take the initiatives to interact, you know, go a step ahead and do it by themselves. So, you know, why don't we sum this up with more about user research? Why don't you tell us about qualitative and quantitative research and standard framework?

Shivani: I think yeah. I mean, maybe I can talk about like a standard framework that you can always think about or little things that you can keep in mind. And it could be as simple as, you know, we all know about. there are like two sorts of qualitative and quantitative research. And a simple mantra for me is to remember, it is like if you're trying to identify the what behind a thing this is when you do quantitative research, things like logging into data, looking at analytics or doing an online survey, but if you're trying to understand the why, that's where qualitative research comes in.

Shivani: So, you know, it could be things like doing micro surveys or conducting those one on one interviews or going in the field and doing ethnographic research. And I'll give you a quick example here, which I always find super fascinating. So my team was actually working for a group, a product which was meant for blind users, and it was not really designed in the process early on. This is a story which goes back way, way back in time there.

Shivani: This research process was not as much of all, but the team still decided to just go out and understand more of what this user is and how do they interact with this device. And it was a very interesting fact that they noticed, which was the speed at which a blind user interacted with that device. Just going through the menu was super fast. And just that little note was something that you would have observed only if you saw the user being in front of them, like being in their natural surroundings, seeing how they use it, because they wouldn't have ever explained it to you, even in one on one interviews that how fast they go through the menu because this is so natural to them. But that little detail is something that led for the design team to think, OK, what can be an experience that could help them navigate through that device faster and meaningfully? So I feel going to those details understanding like what are those moments? What are you trying to achieve and how can you do it? is like there are multiple methods, but you have to really think of what you're trying to achieve and what is the best way to achieve. So there are tons of processes and framework that you could follow. But just keep in mind what your end goal is and what will be most beneficial to the product you're creating or the experience that you're creating.

Priyanka: Thank you, Shivani. It was great to speak with you and regard this being so far away. This was a very inspiring conversation. And for me especially and, you know, our audiences are also going to learn a lot from it for sure. Thank you for being a part of designwise.

Shivani: Thank you. It was an honour talking to you. Thank you so much.

Priyanka: So, that was the conversation with Shivani, which was extremely heartfelt and came through her experience in design for over 12 years. Thank you for listening to us, this was Priyanka Jeph in designwise from QED42.

A little something for the ears, “designwise"
Category Items

A little something for the ears, “designwise"

A QED42 design playlist curated to inspire focus, creativity, and rhythm at work.
5 min read

Coming soon.

Designwise is a podcast created by QED42. It’s a collection of honest conversations with creators, leaders, artists, founders, corporates, peers and misfits.

Why one more podcast?

2020 brought some significant shifts to our priorities and the way people perceive design. We all faced shifting parameters regarding connectedness and business. Similar feelings and experiences led to conversations that gave birth to designwise.

The products we make, the experiences we create — “designwise" talks the truth within and outside the digital ecosystem. Listen and interact with artists and creators from diverse fields as they share their stories, processes, approach and hacks applied by them to achieve desired outcomes. From a Designer-turned-Dj to a street-food-chef. We got it all covered. The promo is here, let's listen!

To stay updated for our first podcast release, tune into Spotify or Breaker.

Why do Companies Need a Design System?
Category Items

Why do Companies Need a Design System?

Why design systems improve consistency, collaboration, and delivery speed.
5 min read

A design system is a collection of rules, constraints, principles and repeatable components that help to create a company’s process to design and build digital products. It is imperative to protect a brand, elevate its end-user experience, align teams and increase the speed of the product development. 

When teams come together to work on different parts of the digital product, inconsistencies in aesthetics and usability become unavoidable over time. A design system aims to solve these problems, that is why some of the biggest brands use design systems for a more efficient design and development process. These include Airbnb, IBM, Google, Shopify, UBER, Salesforce, WeWork, Mailchimp, and even Apple.

A design system is how a product and the company is viewed for years to come. Documentation, as detailed as a design system, braces the values of the company. In this blog post, we will be getting into the details of how a document as detailed and systematic as the design system governs "Team Efficiency, Design Scalability and End-User Experience".

Team Efficiency

Design systems are mainly useful when a team of people or different teams work on the same product. The process of building products requires teamwork and teams from different practices. A design system makes a designer-developer collaboration seamless and makes it easy to build the product without often reaching out to each other.

The old saying, "too many cooks spoil the broth" may be applied here. As for an example, every member working on the project has their preferences, varied ways of working and different approaches, which makes the process complicated especially when the projects are big and there are more chances for things to go wrong. In short, it gets messy, without a similar language, a structure, accountability and the building blocks of the design system.

Empathy and optimism as a core, human-centred design systems put the needs of people at the centre of the most complex challenges.

A successful design system liberates teams from recreating. It allows focus on learning and improving digital products to meet user and business goals but creating the most efficient design system doesn't solve the purpose until it is not actively promoted within the company. From planning to execution and release, the priority should also be to foster the design system's adoption in a community of users who believe in working together on the same principles for achieving the same goal. 

Scaling Design

It's no secret that design is difficult to scale. An efficient design team is not a result of team expansion and hirings. It comes with putting standards in place. As an example, each new hire comes a new set of thoughts, new ideas, new types, new color palettes and different ways of working. More often than usual this leads to unintended duplication of work, haywire tone and voice, negative competitiveness and overall employee dissatisfaction which proceeds inconsistency and result in design entropy.

The solution to this chaos is the design system. A systematic growth in the design system leads to efficiency and consistency in the design process. It also saves time, that is consumed by lengthy meetings and verbal explanations which eventually increases the overall speed in deliveries and product development.

A design system efficiently combines the individual creativity with the company's design standards, and ask any new hire, without a design system, it's not easy.

The onboarding processes, and introduction to the company's values and mission can only do so little without an introduction to a scaled set of design standards. So, design does scale but it scales with a design system. 

End-User Experience

User experience is the prime focus of every product, It's not optional and can't solely be successful based on business expertise, code and design, though the design process is the differentiator here, user experience is also influenced by many invisible factors.

A Design system helps to enhance the end-user experience by giving access to transparent resources with shared design language and guidelines that empower teams to collaborate cohesively and make better design decisions. It also fosters a sense of inclusivity and empathy across teams where roles are given less importance and no point-of-view is weighted heavier than another. These shared experiences and a cohesive work environment encourages team members to focus on the purpose of design, a better understanding of the users and a natural empathetic approach to design that irrevocably translates to a consistent user experience and happy users.

In Conclusion

The challenges associated with inconsistencies and chaos are faced by many companies. The consequences of these challenges come with an associated cost, which is amplified according to the sheer scale of an organization. Design systems save the cost in a long run by shipping in a seamless project without much hustle. They become the spine of any company which aims to iteratively work on a product over time. It is absolutely relevant documentation for team efficiency, scaling design and user experience because it enables collaboration on shared principles creating a cohesive work culture while also encouraging flexible systems to evolve logically over time by developing, reviewing, and improving the sources within the design system.

When developing a design system, it needs to be unbiased towards the use of different technology tools to solve different problems and a reflection of the company's design language. It impacts community and collaboration and how we work together to create digital user experiences that shape the planet.

Is your new UX project getting you worried? Here’s how you can pick the right design partner.
Category Items

Is your new UX project getting you worried? Here’s how you can pick the right design partner.

What to assess when selecting a UX partner for enterprise design and digital transformation.
5 min read

Design is AS important for the success of your business, as the content and functionality. Unfortunately, Design is often an afterthought!

Every $1 invested in UX results in a return of $100

           - Forrester

A good UX design will help you keep your customers happy, as well as bring success to your business. If users like using your website or product, they are more likely to come back and use it again. And this will lead to a sale. Without a good user experience, your business will suffer.

There might come many situations when YOU would look for a design company to partner with. Maybe you're launching a new business, or you think you need a brand refresh. You could be planning a strategic marketing campaign, or you probably are a design agency and want to partner with a UX design firm to help offload some extra work that might be pouring in.

Whatever your motive might be, you need some expert help.

But with so many companies competing in the market, choosing the right agency becomes a challenge. And you know you want to pick the most incredible partner from the best of them.

The question is - HOW are you going to take that decision?

Let’s look at a couple of criteria that you might think of when start creating the assessment criteria.

Would you consider LOCATION as one of the criteria?

Due to COVID-19, people are working remotely and almost everyone is open to picking agencies around the world. With teams scattered across the globe, people are managing overlaps in time zones very well. So in the current situation, the location might not be one of the assessment criteria for you.

The next highly sought after criteria are MONEY.

Is it going to be Cost or Budget that influences your decision? In most cases, you are NOT looking to save money when it comes to finding a partner who can play a huge role in making your business work and customers convert!

Money is important but that surely shouldn’t be the decision parameter. You need to be looking for a “reasonable” engagement and not the “cheapest”. You will understand what the reasonable cost is in your given situation when you speak to multiple agencies.

The golden rule of choosing any vendor or partner is -

“All things being equal, people will do business with and refer business to those people they know, like and trust.”

You need to look beyond the conventional or orthodox criteria and emphasize on identifying credible Design partners. The agencies you trust, who can act as a partner, and most importantly who understand your business goals and pain points.

Now, the difficulty lies in figuring out WHO you can trust. Every UX Design firm will have a strong sales process and they will be putting their best people, the best mock-ups, and the chosen designs upfront. They will all make very similar claims about being creative, engaging and having the most flawless communication and design processes. It’s hard to tell who is overplaying, and who's not.

Most companies are used to interviewing potential partners – asking them to deliver a presentation and written proposal. This is a conventional practice when interviewing a partner for technology, or even a Marketing agency. But this process breaks down when it comes to UX Design.

Let’s discuss some things YOU can do to make a worthwhile selection.

Define the business goals you want to achieve with this partnership

Let’s take a step back and think, WHY do you need help from a UX Design partner? If your answer is “because we want to add a visual wow” then we're not considering the root of the problem. Why do you need that visual wow? What do you think it will bring? should be the question.

People often believe that a website redesign or visual refresh is the business goal when in fact the real business goals are better user adoption, customer acquisition, improved support for sales and marketing, etc. The more clarity you have internally on your real business goals and the reason for bringing in a UX Design partner, the easier it is to settle on the type of partner you're looking for and to determine the selection criteria.

What is going to be your evaluation criteria?

Once you have defined the business goals you are looking to achieve from the partnership, it gets easier to list the evaluation criteria for your team internally. These criteria will be subjective to your specific business goals.

You should have your evaluation criteria ready before you go out looking for Design partners. This helps to amplify the differences among vendors and will help you narrow down the list of Design partners on those specific criteria that are important to your business.

  1. For example, if your company wants to launch a new app in the market and the business goal is to acquire new customers.
  2. In this case, the key factors you would be looking for could be
  • Find similar success stories in their work they have previously done and their outcomes
  • Similar industries they have worked with

User Experience Research Capabilities

A good UX Design vendor should be asking you upfront: “What are your business and product goals? How do you think UX Design can help? How will you select your partner?”

Many creative agencies excel in the visual/aesthetic part of UX Design. While the design aesthetic is a key aspect of a product, it is only a small part of the overall design solution.

For example, your company is looking to increase the number of registrations on your website. The insights on what will engage and drive users to register will come from techniques like paper prototyping, user research or contextual inquiry, and many other possible UX research methodologies. When deciding on a UX Design partner, we need to look for firms that include some form of user experience research in their approach.

Cultural Match

It’s no longer enough to choose a design partner solely based on their technical expertise and ability to deliver the project at hand. Since your Design partner will be serving as an extension of your team, cultural compatibility shouldn’t be overlooked.

When the goals and aspirations are highly aligned, the potential for seamless integration increases. This is what you look for when hiring a new employee, and the same diligence and thoughtful approach should be spent when choosing a new Design partner for your company.

Immersion Workshop

The best way to find out whether there is a good cultural fit between the companies is to ask them if they are willing to meet for a design workshop.  Most UX Design engagements start with a creative workshop that involves a discussion on business goals and requirements as well as some creative thinking. Find out if they are open to arranging a half-day or full-day workshop to give you real insights into what working together will be like and if your respective cultures ‘fit’.

The best UX firms will embrace this opportunity, and use it to evaluate whether they think you are a cultural fit for them too!

You will be able to get a glimpse of their processes, design approach and methodologies. Good UX companies should be able to accurately describe design processes. You will know if they can reason and have a story backed-up with data behind the design decisions.

References

In addition to the immersion workshop, don’t be afraid to ask for at least a few customer references. If a vendor hesitates, that should raise a red flag.

Impartial references tend to be great sources of insight on how the firm really works, how they deal with conflict and unexpected challenges like time constraints, creative differences, etc.

Then make sure you call those references and ask questions such as:

  • Was the Design agency punctual?
  • How would you rate the quality of their services?
  • If something went wrong, did they make it right?
  • Would you work with them again?

Ability to provide Design Consulting

The design agency should be your business partner and not just another outsourced vendor. You need people who have enough knowledge and experience to spot potential UX blockers and identify further optimization opportunities.

It is important to have Designers on board who have the expertise to recommend operational services and professional advice when it comes to improving a design. This will create that clear difference where you will know when you have met an industry thought leader.

One of the signs of an outstanding UX agency lies in its ability to develop a UX that can unlock the potential of your idea and help you gain substantial competitive advantage.

How strongly do they emphasize business outcomes?

Look for business value in their case studies - lookout for how their projects managed to bring in value for the business. After all, there’s no point in a pretty website if it doesn’t help to draw in customers.

A UX team with varied skills

The value proposition of most design agencies revolves solely on their excellent UX design capabilities, but some agencies can offer a much wider variety of skills.

Experienced Design agencies provide more than just UI/UX design services. They also include UX strategy and planning, UX writing, workflow/functional design, workshops, branding, user research, and content strategy services.

When you are already working with a design agency, they are familiar with your brand and totally understand your business objectives. At any point in your engagement, your business might demand design expertise, correlated or not. You wouldn't want to repeat the entire process of discovery with another vendor to fulfil the extra demands in your product. A UX agency that offers varied design services will help you save time, effort and cost, by meeting your requests with their in-house team of experts.

Community Contribution

Community Contribution is a tool for you to gauge passion and stay up-to-date with relevant technology and trends. My contributions to the community, you are assured that the people you are going to work with are not only excellent at their skills but are also passionate about it.

To summarise, here’s the mantra to pick a right design partner for you - explained in three stages:

IDENTIFY - CULTIVATE - ACTIVATE

Identify

Is your new UX project getting you worried?

The first stage is to IDENTIFY. To identify the right Design vendor you may ask questions like:

  • How long have they been in the industry? Ask why
  • Why should you partner with them and not consider other agencies?
  • What makes their business stand out compared to its competitors?
  • Who are their clients?

Such questions will help you filter down to the Design partners who have the 'potential' to take your business to new heights.

Cultivate

Is your new UX project getting you worried?

At this point, you should have a list of potential vendors and you’d want to start cultivating the relationship with the selected agencies.

The answers you should be looking for in this stage —

  • Does your vendor understand your industry?
  • Does your vendor understand you, your business and your goals? Even if your vendor works in your industry, it's more important that your vendor understands you.
  • Does your vendor know who your customers are? A good vendor not only cares about you but also cares about your customers.
  • Does your vendor listen to you? There are some vendors out there who think they know it all. They lecture more than listen. These are not vendors you want to work with. You need someone who listens to you so they understand you.
  • Is your vendor reasonably priced compared to the competitors? The key here is "reasonably priced" and not "cheapest"! After interviewing several vendors, you will have a good idea of what is reasonable.
  • Is your vendor responsive? During the cultivation process, you should be corresponding with your vendor. From this experience, you know how responsive they are. Hint: If they are not responsive during the sales process, they will not be responsive after you hire them.

Now, how to cultivate? Here are some activities that will help you cultivate your relationship with the identified design vendors:

  • Connect with the leadership on LinkedIn
  • Engage with their leadership
  • Invite them to your webinars and events, and attend their webinars/conferences
  • If you like some of their recent work or project launch, set up a time to discuss their work and process
  • Follow their top performer’s Dribbble account
  • Invite them for guest blogs, write for them or they can write for you, i.e. if it is relevant
  • Follow their social media accounts, stay up-to-date about the problems they are solving for their clients
  • Add them to your mailing list, keep them informed about your brand and business growth

Make sure they are already learning about your brand and consumers.

Activate

Is your new UX project getting you worried?

Every interaction you have had while cultivating your relationship, you have taken something from each other, learnt and picked up something from one another, there has been a transaction of ideas.

Now, it’s just like pushing a button - when you have a design ask. By now, they have learnt about your company, your consumers AND are ready to bridge that gap and address your business goals and troubles, as they are truly prepared for it.

Conclusion

Choosing the right UX design partner can be overwhelming for most of us, especially those who aren’t familiar with the design process. But making the effort to translate your business goals and define the assessment criteria, could help you achieve profitable outcomes. Though such successful outcomes are not earned by just hiring a vendor - but it surely needs to start with a conscious engagement. Choose a partner whose skills align with your desired success, and you are certain to follow returns.

Design Documentation — Style Guides and Design Systems
Category Items

Design Documentation — Style Guides and Design Systems

The Style Guide establishes the root for visual presentations and a design system connects components, patterns, and visuals together to become one single source of truth for products and brands.
5 min read

What are Style Guides and Design Systems? The Style Guide establishes the root for visual presentations and a design system connects components, patterns, and visuals together to become one single source of truth for products and brands. Well, something like that and as there are many differences there are similarities as well. Style guides and design systems both save a lot of time and misunderstandings. They both increase the workflow and efficiency of the team. They are both documents with different content, they both have the same purpose — allowing multiple contributors to work consistently to create a consistently awesome experience for people and set a unified voice and tone for a brand.

The question is why don't we simply call it documentation? Because they are simply just different kinds of documentations contributing to what is mentioned above and a lot more. Well, we can but there is a high probability that at some point we will have to explain the difference between the two in detail. Let's begin with style guides as they are comparatively concise, compact, and visually viable to understand.

Style Guides

A style guide is a documentation of the guidelines for a brand's visual and content elements. It defines the visual representation of a brand and establishes the root of its voice and tone. It is a document of the choice of colors, the prominence of the logo, and the language. It's a document of all things you see, read, and remember about a brand. Companies, Agencies, brands, freelancers, designers, and developers deploy the style guide to avoid wasted time and efforts in bringing the brand's message together.

An example of a style guide.

The purpose of a style guide is to make sure that contributors add to the guide clearly and cohesively that reflects a brand's style and ensures brand consistency for everything from writing to design. A style guide also supports marketing initiatives as everything in the style guide focuses on company values and goals.

Building a style guide describes a brand's strategy in a unified way. It is build to maintain consistency in work and flexibility in the team for a coherent and recognizable end product experience.

A Style Guide should contain: 

  1. Purpose — Individual pieces on the company's goals, values, perspective, and purpose.
  2. Product Branding Guidelines — Company’s internal baseline for product and service.
  3. Visual Elements — Defined visual styling of the components.
  4. Typefaces — Fonts and details on their usage.
  5. Voice and Tone — The editorial language details.
  6. Language — Clear communication in one language or more.

Design Systems

In a design system, the major part of the documentation is the list of components, at its core, this is a pattern library with code that is required to create and build from the components. A collection of all the pieces from the design system can be used to create interfaces, build screens, and workflows.
Companies choose many different ways to organize the content of the design system which is based on the product requirements and business goals. Most begin with most basic blocks like buttons, text boxes, and so on and then they build up through levels of abstraction to templates and whole pages.

An example of a design system.

Some companies only list fully built interface components that are ready to use like date pickers, accordions, log in dialogues, and forms. Each of these components has details of how and where they will be used and how will they vary in look and behavior. 

Most design systems provide code to show how that interface is represented by an actual example. They also provide a list of variables that can be set either through cycling or through code. Some companies integrate their design system with their visual tools which make creating a screen or a new prototype is as simple as dragging and dropping from the design system. This is the advanced functionality of the design system and shows the possibility and power of a well-thought design system. 

Design systems are grounded in the stories of the teams behind the digital experience and needs of users.

A design system should be created with reusable parts with complete code to make sure that the company's design language is consistent throughout the product. 

A design system should contain:

  • The Building Blocks — Rules, Constraints, and Principles that set the foundation and guidelines for using the design system.
  • Design Elements — Colors, typefaces, layouts, and the remaining visual elements with their precise usage details.
  • Components — All those shapes and features that are required to develop new products and solve UI problems.
  • Patterns — Reusable combination of components with code.
  • Content — A defined voice and tone for the design system and the product.

Conclusion

As you decide to document and create your style guide or a design system, take into account that there is no correct way to get through this, there are no lengths and depths that can be pre-decided. All these decisions should be taken after considering the size of the company, the scope of the product, and business goals.  

Start by determining and documenting the basic building blocks - Rules, Constraints, and Principles and structure your style guide or design system's menu around what is required the most. 

The work over a style guide or a design system is never really over. As we mentioned in our previous blog — The Building Blocks of a Design System — A design system is a continuously evolving comprehensive guide and so is a style guide, they are versatile documentation that morph and change as the product does for a product that resonates with the needs of users with consistency and reliability. 

The ROI of UX Design
Category Items

The ROI of UX Design

How UX design increases business value through better usability and engagement.
5 min read

When designers begin to think, process, and write about design it leads to ideas, it leads to concepts and ideas that you wouldn't be able to create otherwise. Similarly, when designers observe how their design add value to the people's life, when they make an effort to learn about how the design has empowered people, made their lives easier, how is the design being used and most importantly when designers analyze the end result of their design solutions and follow up on it, this analysis certainly makes them, "design-wise".

All that wisdom but how do you explain that with numbers? How do we measure UX design? What value does UX design bring to a company?

These are common questions and at some point, every designer has had to advocate the value of design in terms of ROI (Return of Investment). To measure the impact of UX design, we have to choose the right metrics and develop an ecosystem to evaluate designs and track progress over time.

Everything about design has some value to it, a value that can be experienced in terms of solutions but a value that's also difficult to access, hence making design difficult to explain and all the more difficult to calculate.

Explaining ROI

ROI is a financial metric used to analyze the scope of investment and figuring out the scope of improvements. In UX design, these metrics could be described as measures that calculate the effect of an investment in design. ROI measures also help to achieve design goals from a business point of view. So, ROI is simply a ratio of money gained over the money invested.

Selecting the Right ROI

For most businesses, ROI is calculated according to the defined KPIs (Key Performance Indicator). It is almost impossible to calculate the ROI of a UX design at the beginning of the project, those calculations are mostly based on assumptions and how much design is valued at a firm while within the design teams and decision-makers, these factors are calculated over a while with various tried and tested methods.

Once the product is out there the selection of applicable ROI metrics is based on what business metrics are most important for achieving the aligned goals. If it’s a retail website, the conversion rate and average based calculations become inevitable. If it’s the calculation for a customer service page, the focus is on the average call time and reduced call durations. If an app is designed to facilitate medical needs, metrics are focused on calculating reduced error rates.

In a world where interactive and unforgettable experiences translate the value of a website, business owners are consistently investing more time and resources in UX Design. Similarly, it has also become important to measure, the design that helps modern brands stand by identification of the errors to ideate the right solutions.

To calculate the basic loss and gains, let's now understand the three basic ROI metrics of UX design.

1. SUM (Single Usability Metric)

One of the most effective ways of identifying the problems to find the right solution for UX design is SUM (Single Usability Metric). SUM is a standardized usability metric that measures the basic components of usability — effectiveness, efficiency, and satisfaction through task completion rates, error counts, task-times, and task-time satisfaction.

Less UX Errors = Lesser Conversion Drop Offs

The SUM calculator takes the raw usability metrics on a task-by-task basis and converts them into a SUM score. The SUM algorithm is automated to calculate the maximum acceptable task time which assists in analyzing UX errors to optimize conversion.

2. Conversion Rate

The conversion rate is the ratio of total visitors who take desired actions. As a general categorization, there are two different types of conversion — Macro and Micro. For example, if you need to track the number of people who completed a purchase through your website.

Conversion% = (No. of Purchases/Total Visitors) x 100

So, if 1000 users visited your website and 20 of them made a purchase, then the conversion rate percentage of the purchases will be calculated as 20/1000 x 100 that will be 2%. This is an example of macro conversion.

Micro conversions are actions that accelerate macro conversions. It includes blog subscriptions, social media followers, blog posts, case studies, and e-books reviews, and views however both are calculated with the same metric.

3. Drop Off Rate

Drop off rate is an important ROI metric to calculate the impact of UX design. If the visitors on the website are not completing a purchase and are leaving the cart abandoned OR if the regular visitors of your blogs are not turning into subscribers, this means that you are losing potential conversions. This problem of incomplete tasks by the visitors regularly indicates a problem in UX design. The formula used in calculating the drop off rate is: 

Drop off rate % = (Number of users / Number of unique users in each segment) x 100 

The drop off rate calculation is an important metric of design measurement to identify the steps that may be causing the drop. Once the drop off rate is calculated 

It is important to measure your drop rate in order to identify the steps which are causing the visitors to ‘drop off’. Once the drop-off rate is calculated, an analysis can be conducted for making the necessary improvements required to optimize the user experience.

Conclusion

It has been established over time that the value of design is hard to measure and define. For non-designers to see an unclouded impact of design as a differentiator, measuring its impact becomes indispensable. These consistent measurement practices help to create an integrative resource of analytics to design more efficiently and effectively.

In design, however, these measures are not always similar to other fields of work. The calculations shouldn't revolve around mathematical formulas. Measuring UX design through algorithms is not the only basis of its assessment.

Design shouldn't always be looked at as an expense, the investment of a good design can also be valued through its capability to engage, influence, and function. Design can also be seen in good content, aesthetics, and in its capability to meet the user's needs. A design that unifies a brand's message, strengthens business with clarity, and provides solutions affects the overall profitability through memorable experiences, and as we all know good experiences are the whole basis of a good UX design. 

The Value of UX Design
Category Items

The Value of UX Design

Strategic UX design strengthens usability, conversion, and brand credibility.
5 min read

As we spend more and more time with our digital devices, we are all that we describe as "users". When we visit a website or use an app all we are looking for is a way to have an effortless experience, without having to think less and do less.

There are reasons why some search engines feel better to use, why some payment apps feel safer than the others, why it's easy to use one website's customer care service and on the other, we can't seem to find the options we are looking for. All those unforgettable user experiences come from well planned and executed design solutions. Businesses that recognize the value of UX design understand the importance of providing memorable experiences to their users and believe in creating long-lasting relationships with them.

“That's nice to read, but what exactly is the value of UX design.”

To make the case for the value of UX design more legitimate, let's speak the language of numbers.

Effects of bad UX design

  • Companies lose $62 billion every year due to poor customer service.
  • 70% of customers abandon purchases because of bad user experience.
  • 91% of non-complainers just leave and 13% of them tell 15 more people about their bad experience.

Results of a good UX design

  • Research shows that, on average, every $1 invested in UX brings $100 in return. That’s an ROI of a whopping 9,900%.
  • A well-designed user interface could raise your website’s conversion rate by up to 200%, and a better UX design could yield conversion rates up to 400%.
  • 8 in 10 customers are willing to pay more for a better user experience.

UX business cases stats

  • Jeff Bezos invested 100X more into customer experience than advertising during the first year of Amazon.
  • AirBnB’s Mike Gebbia credits UX with taking the company to $10 billion.
  • After Virgin America redesigned their digital travel experience they experienced a 14% increase in conversion rate, 20% fewer support calls, and flyers booked nearly twice as fast, on any kind of device.

In the McKinsey quarterly, The business value of design they tracked 300 companies for more than five years and concluded, diversity among companies achieving top-quartile MDI performance shows that design excellence is within the grasp of every business, whether product, service or digitally oriented.

So, what do we see here? It's not just number, It's how UX design has proven itself to be the most credible part of a digital experience. Good design is an enabler and is the only differentiator. To create a memorable experience that works both in favor of the users and business owners comes only through design.

Conclusion

UX design is a process of creating thoughtful products through solutions driven by the human-centered design process and an abundance of creativity.
The value of user experience design can be seen in Uber, Etsy, Airbnb's, and the success of many businesses over time. There were many smartphones before Apple released the iPhone in 2007, Vacuum cleaners did exist before Dyson, people did take taxis before Uber and used social networking websites before Facebook.
All the companies, that care about how users feel and understand their needs and behavior, the companies that value design, create great designs that make a difference to the world.


"UX Design".

Its a field of work where you can be brilliant and create wonderful experiences but still not be able to communicate the value of it. Its value is seen over time. Its value is the people.
Designing a solution that adds value to the user's life and business requires focus and precision. The focus should be on how do you want the user's to feel? how do you want to create a connection that lasts? how do you make their life better? and to create that kind of perfection, it takes time, it takes space, it takes to value design.

How to use GraphQL Custom Scalar Types in schema design.
Category Items

How to use GraphQL Custom Scalar Types in schema design.

When designing GraphQL schema using the build schema function, we have to specify the scalar types for each value of the query. In this post, we’ll see how to use some custom scalar types in schema design.
5 min read

The GraphQL schema is the core component of every GraphQL server. It allows us to define object fields and types that represent the data that can be retrieved from the API.

GraphQL Custom Scalar Types

When designing a GraphQL schema using the buildSchema function, we must specify scalar types for each query value. GraphQL supports some predefined scalar types, including Boolean, ID, Int, Float, and String, which can be directly used in the schema.

However, there are common scenarios where we want to use custom scalar types such as DateTime, JSON, or Object. In this post, we will explore how to use these custom scalars in schema design.

To define a custom scalar, simply add it to the schema string using the following notation:

Schema:


scalar  scalarName

Let’s take a look at some scalar types:

DateTime

As mentioned above, there is no DateTime scalar type. Therefore, to build a schema for the DateTime type, we have to use the scalar type String. Let's take a look at the example:

Schema:


type user {
name: String
createdAt: String
}

When attempting to retrieve data in GraphQL Playground using a simple query, the response will be similar to the following:

GraphQL Custom Scalar Types

The timestamp in the given string represents the number of milliseconds since the epoch (01/01/1970). However, this does not indicate that the returned string is any ordinary string. It is actually an ISO string that represents a date/time value.

We prefer using the ISO format because it is a standard format that is more human-readable. To declare and use a custom scalar type called DateTime, follow the schema given below:

Schema:


scalar DateTime
type user {
name: String
createdAt : DateTime
}

The schema in the playground appears as follows: 

GraphQL Custom Scalar Types

By doing this, we clarify that the createdAt variable is of type DateTime.

With this information, we can now send a query:

GraphQL Custom Scalar Types

This indicates that the GraphQL response includes an ISO string date.

Object / JSON

In certain queries or mutations, the output is unknown.

For example, when using the aggregation query in GraphQL, the response is not fixed and varies depending on the query, making it difficult to define the schema. Similarly, when updating or deleting a record, the response may be as follows:


{ 
  count: 1
}

To achieve this scenario, we need to define a schema.

Schema:


input userInput {
            name: String
            email: String
}
type result {
count: Int
}
type Mutation {
  updateuser(id: ID!, input: userInput): result
}

Here we can see that we need to define the schema for the result type and userInput input, but doing so can be redundant and impractical in many cases. Additionally, what if the response is dynamic, such as in aggregations?

To address these issues, we can use a custom scalar for Object or JSON. 

  • Object

Schema:


scalar Object
type Mutation {
  updateuser(id: ID!, input: Object): Object
}

GraphQL Custom Scalar Types
GraphQL Custom Scalar Types
  • JSON

Schema:


scalar Object
type Mutation {
  updateuser(id: ID!, input: Object): Object
}

GraphQL Custom Scalar Types
GraphQL Custom Scalar Types

Custom scalars are a powerful tool in a GraphQL server schema that provides a more meaningful representation of its response while avoiding redundancy in the schema definition. They are essential when the built-in scalar types provided by GraphQL are not sufficient, such as when working with dates and times, or JSON data. With custom scalars, complex data structures can be represented in a way that is easy to understand and work with. To learn more about GraphQL, visit the GraphQL website.

If you have any questions about using custom scalars, GraphQL, or anything in general, reach out to us at business@qed42.com.

The Purpose of Writing Scenarios and Creating Storyboards after Ideation
Category Items

The Purpose of Writing Scenarios and Creating Storyboards after Ideation

Scenarios and storyboards are techniques that help to connect dots from the idea, to identify how will the idea work in the real world. They create a bridge to explain the user experience in a real situation through text and visual representations.
5 min read

So, after running some successful ideation sessions and finding a perfect idea that addresses the pain points, now is the time to create some scenarios and storyboards to create a more complete design solution, communicate the interaction and user experience in a human-centered way. Scenarios and storyboards, both can be understood and practiced with people who do not specifically have a design or technical background.

A Scenario is a description of a possible, imagined, and projected sequence of events. A Storyboard is an illustrative representation of how the scenario unfolds. Scenarios are self-created, workable, and flexible scenes created to motivate "what if the user?" thoughts and storyboards are a visual representation of how the users will interact with the design solution.

Scenarios and storyboards are techniques that help to connect dots from the idea, to identify how will the idea work in the real world. They create a bridge to explain the user experience in a real situation through text and visual representations.

Importance of writing scenarios and creating storyboards

  1. They ensure that the idea is executable.
  2. Help to predict and synthesize user behavior.
  3. They describe the real circumstances in which the end product is likely to be used.
  4. It's easy to spot early errors.
  5. The visual representation facilitates a better presentation of the idea.
  6. Helps to bridge the gap between creative thinking and business thinking
  7. Both are team-based activities, hence encourage equal participation and contribution from designers and non-designers. 
  8. While looking into a tangible verbal and visual portrayal of the design solution, it's difficult to get attached to the idea.

Let's now look into scenario writing and storyboard one after another, understand how each of them works, and understand the importance of both techniques to create a prototype.

Scenarios

A scenario could be described as logical and real circumstances created through words and text to understand how the design will work in the real world and how will the users react during their interaction with the product in a particular situation. It could also be described as a development of a story from the users' point of view.

As an example, a scenario could help to capture how would the identified user or a group of users use the website on a mobile device while making a purchase?

or

A more detailed scenario could be, Lily is new to the city, she is shopping at the orchid street, she is looking for a glass vase and is using the new app to locate stores nearby but she has a lot of shopping bags in hand. How can the features of the new app solve the problem for her?

or

It's Sunday afternoon, Lily is making a list of things that she needs to do before she starts her work from home routine on Monday morning. Lily works on a desktop. She has to get the groceries, meet her aunt Suzy, complete a presentation, and sleep on time. How will the app help her to complete her presentation on a mobile device since she is can't be home all day?

Specific scenarios like these help to outline particular areas for product functionality and describe the website and app interactions with the users and find out how your idea can make users' regular day better.

Picture showing sticky notes, writing and managing scenario.
Photo by UX Indonesia on Unsplash

Writing Scenarios

  1. Start the activity by dividing yourselves into pairs or small groups so that you create and write a story that everyone in the room understands.
  2. Create an understanding of the users and the context of the idea.
  3. Understand the empathy map from the first phase and the problem statement from the second phase of design thinking.
  4. Understand Who are the users?
  5. What circumstances do they live in?
  6. How is the idea of going to solve their problems?
  7. Identify scenarios from the daily activities of the users' life.
  8. Review and understand the defined scenario and the identified features of the end product.
  9. Use sticky notes to write down each activity that the user may take in a particular situation to reach the desired outcome.
  10. Focus on writing the efforts the users' will put, what will they think and how will they interact.
  11. Write one step at each sticky note and swap the steps to create a journey.
  12. Once each pair or group have completed writing about the interaction of the end product, features with the scenario — Present it one by one and discuss the whole scenario and outcomes with everyone.
  13. Let everyone ask questions, give reactions and feedback to each other.
  14. Combine the best possible journey into one scenario to take it to a next level and create storyboards.
  15. Repeat the same process of the scenario technique for each kind of interaction.

Just makes this as realistic as possible. Write it easy and avoid jargon, remember you are doing it from the users' point of view. To make a scenario more realistic and believable you can always act it out to find if your scenario is moving naturally while focusing on interaction rather than the interface.

Storyboards

The storyboards are a way to explore and illustrate scenarios visually. It can also be explained as a sequence of scenarios illustrated to explain, identify, and present the idea visually by understanding the user flow. They help identify a problem that may come later while prototyping, testing, and developing the idea.

The storyboards were originally developed and practiced by Disney Studios in the 1930s.

When Airbnb CEO Brian Chesky read Walt Disney’s biography, he discovered the storyboarding technique invented by Disney and his animators to create Snow White and the Seven Dwarfs. It was a light-bulb moment for Chesky, who immediately decided to adopt storyboarding to design the future of the Airbnb customer experience. 

Airbnb is a very successful and inspirational example of how creating a storyboard can communicate an idea better, lead to result-driven design solutions, and understand the users' experience.

Storyboards allow us to understand deeper emotions associated with the idea, that the words can't alone explain. They don't depict the scenario as is but are a close depiction of a well-written scenario.

Hand sketching illustrations may sound a little scary but that's not the main goal of storyboards. It is the formulation, understanding, and the right depiction of the scenarios, That's why if the team responsible for creating storyboards weren't a part of the ideation and scenario sessions, make sure they know all about it before creating storyboards.

A picture showing the creation of storyboard technique
Photo by Amelie Mourichon on Unsplash

Creating Storyboards

  1. The medium or stationery used in creating storyboards is a very personal choice and could vary from one designer to another.
  2. As base use sticky notes to draw they are great to rearrange, replace, and merge if required to swap from one storyboard to another or cut white sheets into equal panels and use double-sided tapes to stick them conveniently.
  3. Sketch the scenarios with emotions and scenes to create stories that connect.
  4. Carefully demonstrate users' reactions as they interact.
  5. Sketch each panel individually, but change panels when there is a change in the scene or there is a need to show a specific emotion that completes the story.
  6. Put the panels on a sheet leaving space for text.
  7. If you are not using sticky notes, don't stick the panels until the order of all the scenes is concrete.
  8. The text could be the same words as the scenario or an edited version to explain each illustrated scene.
  9. Once you have achieved a comic-bookish storyboard, review the storyboards with team, and consider the feedback.
  10. Revise, if needed go back and fix the scenes.

Storyboards are not necessary after all scenarios and ideation sessions and especially when everyone on the team has a clear understanding of the idea and the end result.
Saying what was said earlier — storyboards are not about great sketching skills, don't let that hold you from doing this very important exercise when there is a need to ensure better communication of design, understand users' more in detail and if you want to give a visually stunning presentation to the stakeholders.

What Next?

Writing scenarios to Creating Storyboard is a form of low fidelity prototyping. Low fidelity prototypes are easy to create, visualize, and are inexpensive. Through these techniques, we gain an overall view of the product. In the next blog post, we will be explaining high fidelity prototyping to gain insights into the overall viability of the product while we have the idea and answers more defined. This phase helps to build a precise model of design aesthetics and functionality. As time-consuming as it may be but this process has the potential to show the real product.

Ideation in Design Thinking
Category Items

Ideation in Design Thinking

Frameworks that help design teams generate, refine, and test new ideas.
5 min read

Ideas that work are not easy to come by and the one that works might not be able to solve all users' problems. Sometimes, we like an idea so much that it gets stuck in our mind and doesn't let more ideas come by. Even if the idea is great, letting go of that one idea for a while to create more ideas and more solutions is "The third phase of design thinking — Ideation". 

Ideation involves creating a large volume of ideas. This phase is a step ahead of obvious solutions. It fuels the innovation process through potential ideas and the source material for building a prototype in the next phase of design thinking.

Without the phase of ideation, a problem statement would just remain what it is — a problem.

It can be practiced individually but a single person can only deliver as much as their understanding is of the problem. When a team of design thinkers is involved in idea generation, ideas can be generated with people handling different parts of the project, graphic designers, visual designers, UI/UX designers, content creators, UX writers, developers, project managers, decision-makers, and people spinning different parts of the project to generate multiple concepts and then create an overall composite of all of those concepts as one idea.

What does the phase of ideation do?

  • Gives the mind time, space, and environment to think about many-many ideas.
  • Increases the number of potential ideas quickly.
  • Assists in the refinement of ideas.
  • Helps to incorporate different elements of different ideas together to fit users' needs.
  • Focuses on users' pain points to find design solutions.

How does ideation work?

The first phase of design thinking, empathize uncovers the real unspoken needs to truly resonate with the users. The second phase, define synthesizes the analysis of the empathy map to create a clear, actionable, and defined problem statement. In the ideation phase, the pain points from the empathy map and the problem statement together enforce a quantifiable number of ideas to prototype, test, and generate human-centered design solutions.

How to create an ideation session?

Creating a good ideation session is important and is hard work. It is a strategic and structured process of reaching the design goal by exercising several carefully created exercises with a team to generate innovative ideas.

There are no rules when it comes to thinking about potential ideas, in fact, the crazier the better but there should be guidelines for organizing a session.

  • Everyone in the room should be comfortable and at ease.
  • This is a creative exercise people should be appreciated and motivated at each point.
  • Don't criticize an idea based on personal opinion, always go back to the problem statement to see why you are doing it.
  • Follow a plan, always set time limits for each activity.
  • Respect the participants, their ideas and their time.
  • Keep all stationery and related material interesting and handy.
  • Most importantly — keep it creative and have fun while you are at it.

The process of Ideation

Brainstorming

To begin with, the brainstorming session, select some questions. According to Ideo, articulate the challenge as a How Might We statement. Depending on the problem statement, you could ask three to five questions. Ask questions that are simple, clear, and focus on one question at a time. Act on problems through post-its, writing, or sketching.

In a brainstorm, the team works together to reach new ideas by building on each others' ideas. The feedbacks should be inspiring, motivating, and focused on the problem statement.

The primary flaw of brainstorm sessions is that they usually do not have a judgment-free environment. Often the conversation gets dominated by one or more participants, limiting the contribution of others. This is called "Group Think". Usually, that reduces creativity and leads to ideas and decisions that are not completely rational.

Only collective creative work enables building ideas and motivates them to get inspired by each other’s ideas to create a digital design solution that truly resonates with the users.

Design Charrettes

According to Neilsen Norman Group, Design charrettes inspire design sketches and ideas, include more people in the design process, explore and expose goals and objectives of colleagues in multiple functional roles, and drive off designer’s block.

A design charrette creates better ideas than the other process of ideation because it —

  • Focuses on creativity than interface design only.
  • Opens up team creativity.
  • Gives everyone an equal opportunity to share their ideas.
  • Generates several workable and actionable ideas.
  • Early and equal collaboration of ideas saves from issues and concerns that may come up later.
  • Sets original goals and design solutions based on quantifiable metrics and expectations.
  • Ensures team work for the current and further projects.

The process of design charrettes, also known as design studio begins with making each participant familiar with the pain points and the problem statement. State the goals and expectations of the process and the project make sure each participant has clarity about the project.

  • State the pain points from the empathy map and problem statement clearly on a board that should remain visible to participants all the time.
  • Communicate the time limit for the process and each exercise within the process.
  • Provide everyone with clear sheets to sketch or write their ideas.
  • Each participant should sketch and write their concepts individually.
  • Give each participant time and time limit to explain their ideas.
  • Discuss the ideas, remain positive during this exercise. All ideas are good ideas.
  • Identify the potential ideas and divide the participants into pairs or small groups to collaborate and synthesize on the potential ideas to create refined concepts.
  • Encourage the participants to re-imagine and improve the ideas in the given time limit.
  • Use "Dot voting" system, as a way to finalize decisions in a time efficient manner.
  • Finally, discuss the full interactions and feasibility of new concepts as a group to make some design decisions that could be carried out as prototypes.

The process of Design charrettes while ideating requires diversity in participants who challenge each other and can work alone or in a group but together toward a common goal. Document the process so it can be referred to while working on the project further. At the end of this process make sure to finish with a clear summary, some decisions, and next steps about the future of prioritized ideas.

There are many ways to ideate and everyone does it differently after practicing, finding out errors, and identifying what works the best for their team and goals. One such blog on different ways to ideate is a compilation by "Just in mind" — 8 UX ideation techniques to try out and 7 ideation techniques to supercharge your next workshop. There are several web tools available for ideation sessions and there is no single process in ideation that suits all. You could find some that may work for you on the "Session lab blog" — 20 Best Online Tools for Design Thinking and "Wrike blog" — 13 Free Brainstorming Apps and Tools to Spark Innovation.

What next?

Ideation is over. Now the focus is on prototyping and finally testing but there is a lot to do after the ideation sessions and before the prototyping begins.

The techniques used in ideation sessions save time, use that time to work on the idea more thoroughly. Narrow down the ideas to one idea from which you can build on by creating scenarios and storyboards. They provide a reality check for design by helping to identify how the idea will work out with the users in the real environment.

This comes before prototyping begins and we will be talking all about creating storyboards and scenarios in our next blog post on design thinking.

Basics of Writing Blogs - The Good Web Content Series
Category Items

Basics of Writing Blogs - The Good Web Content Series

Key principles of effective blog writing for digital audiences that balance clarity, structure, and value.
5 min read

How do you write good web content? Good web content could be useful for some and not of any importance to many. There are many elements to the well-written web content, a well written about page, service page, the meta description, product description, career page descriptions but they are not the limit. An organized page with journal entries, information, stories as a blog page keeps the users consistently connected and engaged.

The good web content series is an attempt to write and create an informative collective of many topics, pages, and different kinds of content and copy that goes on a website. The first post in this series is focused on writing good blog posts.

Well written blogs are a tool for creating a strong web and social media presence. They are written to increase visibility, create a brand image, and show specific areas of expertise to the identified audience.

Before planning, creating, and writing content for the blog posts it is important to understand the three key questions and their explanations.


How do people search for Blogs?

Users mostly have two ways of finding the blog posts and to read content on your web page. First, if you are established as a content and information provider users come to your website directly or it's simple they find you through keywords. It's important to research for searchable and trending keywords before creating content for a blog post. Those keywords should also be a part of your blog title and should be edited and added to existing content.


How do people read Blogs on the websites?

Reading a book is different from how users read and consume content on the web. They take a quick impression while scanning the entire content. They usually read in parts and focus on the content they are interested in and skim the remaining content.

It's important to write content that is minimal, to the point and easy to understand. Another way to increase engagement is to add interesting sub headings and bold the insights and takeaways.


Why is it important to define your writing goals and organizational goals?

We know that the users are important but have you defined your goals, needs, and reasons for writing blog posts? What are the goals of your organization? and what are you attempting to achieve?

Are you blogging for business? Is it to make product sales? or deliver a service or create a brand image? you could be creating blogs for digital marketing campaigns, or to increase your presence. Every organization has different reasons, to begin with, content-based blogs. Defining those goals is important to aim at achieving them strategically. These details make up for your content calendar and help to show your area of expertise to the right audience.

According to the Hubspot blog post, The 4 Most Important Pages on Your Website (& How to Optimize Them) a blog page should be optimized keeping the below points in mind.

  1. Organize information on your blog clearly — Divide the information on the blog page in different and appropriate categories and sub categories. As design, events, technology, knowledge and learning, compilation, case studies, e-books, downloadable PDFs, newsletters and so on. This makes the search easy for the users once they are on the website and navigating it for information relevant to them. Separate the most recent ones, from the most popular and old content. This helps to makes sure that the right content gets the attention it needs.
  2. Include CTAs — Add a call to action button for subscriptions and other actions like downloadable files that are valid to the blog posts.
  3. Provide CTAs in the core design of your blog — Place the CTA intuitively. Read more in detail about the importance of CTA in How Design Influences the Conversion Rate of a Website.


What to do?

Understand your readers

Identify the audience who is going to read your blog before deciding what you want to write. Define the knowledge, information and story that the particularly identified audience would like to read. Write to the needs of the audience. Figure out the possible questions and answer them in a relevant way while providing valuable insights.


Identify the Keywords

The most important part of good blog content to attract new visitors are the keywords. Identify the words visitors are already looking for as this gives information about the keywords used to reach your website. Stay updated about trending words and analyze the keywords on the websites similar to yours. Use the Google Keyword Planner to find out the search volumes of keywords and stay updated about keywords forecast.

Research and search consistently for the keywords according to your planned content calendar and marketing campaigns and make sure to duplicate the most searched keywords to keep the visitors.


Create easy to scan content

Title, headings, subheadings, quotes, bold sentences are integral to creating an easy to scan blog post. Give the reader meaningful, clear, and direct information through bullet points, infographics, numbered lists, summaries, and overviews.


Write simple and easy content

Not everyone knows everything but they could be curious. How do you explain something to a non-expert? Find easy ways to write difficult terminologies, acronyms, and jargon with simple and clear expressions.

More than three to five sentences in a paragraph is writing for fiction. If you want your words to get more attention give them less, keep it short.

As explained in How to Use Short Paragraphs to Strengthen Your Writing short paragraphs are more readable on a screen and less text keeps readers’ attention.


Write authentic content

Authentic content will always keep the readers coming back to you. Keep your facts checked and accurate. Write like you mean it and like you are having a conversation with the reader. Build trust with your writing by providing sincere and straight information, a true insight into a story.

Mention the resource of your information. Mention yourself, let the readers know who are they talking to, and give credits where it's due.


Create a unique tone and voice

But a tone and voice that the readers can relate with.

Almost 2.75 million posts are published each day on WordPress alone. With so much of words being written and millions of blogs being published, how will your blog stand out with unique and different content? How are you supposed to sound? what to do when what you are writing may have or has already been written?

Simple, sound like yourself and your brand values. Combine your research, knowledge, experiences, and learning into a storytelling compelling content with the organizational goals and values.

The tone and voice are what communicates your uniqueness, your way of writing explains how you work, the efforts you put into making reading informative, fun, and knowledgable. This builds a relationship with your readers, they keep coming back for.


Keep it human

Have you ever wondered what makes your blog content more relatable?

People know when you pay attention to them, your readers are no different. Thoughtfully written content gives readers something to relate too and turns the information into a conversation.

Address the reader's problems before answering them. Explain the challenges and goals of solving the problem. Keep yourself inspired and go the extra mile to research for those answers. Infuse more real-life experiences and work examples in knowledge and informative content.

As explained in 17 Blogging Mistakes to Avoid in 2020, According to HubSpot Bloggers People want to feel like they're doing business with real people, not robots. So, get rid of the jargon. Make a pun or two. That's how real people talk -- and that's what real people like to read.


Give attention to what's working

If you have no idea who is reading your content, then why did you write it?

This may sound like it has come from a school teacher's vocabulary but studying blog analysis regularly is an unavoidable mathematics exam that everyone has to take to reach the next class.

Let's look at the statistics below.

Once you have the data available, it gets easier to make decisions and back up those decisions. As defined, analytics uses data and math to answer business questions, discover relationships, predict unknown outcomes, and automate decisions.

When you find something that's working, continue the improvements based on data and readers' responses.


Conclusion

Writing content is a way of telling a story that is informative, engaging, and interesting. A story that could be about any topic including product, service, and business. The story could be created to give insights about design or explain something tech. It could be about work culture, real-life experiences, learnings, and many other things.

When it comes to creating a content calendar and writing for a blog driven by strategy and research — do it with a purpose. Solve a problem, answer some questions, tell the story of your brand, and share your area of expertise by adding value to the readers' life.

Effective Stakeholders Interview: The 10 Crucial Questions for a designer
Category Items

Effective Stakeholders Interview: The 10 Crucial Questions for a designer

Top 10 Stakeholder Interview Questions.
5 min read

A focused, detailed, and concise stakeholder interview is the key to getting started to foster commitment and gather knowledge about the website design project. It helps to make the right decisions, avoid end moment disappointments, and changes to create the right product. As also explained in The Process of Redesign—Part 1 the designer's sole part here is to ask the right questions, listen, learn, adapt, and understand the stakeholder's point of view. 

It's the easiest way to avoid future shortcomings, miscommunications, creative blocks, and endless cycles of revisions. The stakeholder's interview helps to create an understanding based on the needs, demands, vision, goals of the clients while validating the project's stakes with the right objectives and knowledge. This process certainly makes the rest of the design project smooth from the organizational point of view.


The right question is the way to reach the right solution.


So, what are those right questions? Should the questions be scripted or keep the conversation natural?
A scripted set of well-crafted questions keeps the communication smooth and the process of stakeholder interview concrete and should be prepared ahead of the meeting.


So, now that we understand the importance of stakeholder interviews. let's begin with the 10 crucial questions while also validating the reasons behind them.

1. What are the goals, values, and vision of your company?

The information that comes from asking the goals, values, and vision is extremely important and serves the whole project. They help to understand the stakeholder's priorities and are an effective way to gather insights about the business. Some of this information becomes part of the landing page and adds to the very crucial information of the 'About us' page of the website. Take interest to ask these questions separately or together but make sure to record or take proper notes of the information that the stakeholders have to provide.

2. What are your growth metrics for the next 1, 5, and 10 years?

Business goals of the future need work from the beginning of the project. Are the stakeholders looking at brand awareness? or they want to generate revenue through specific ways. They could be looking for more investors or trying to enable the value of their orders. Listen as they speak, before jumping to conclusions or the next question. A good design solution comes out when you have measurable growth insights in your hands.

3. What problem does your product solve and how commercially viable is it?

Understand the product they are selling, this is their core. How is the product made? or it a service that they are selling? Frame your questions accordingly and get a deeper knowledge of the entire journey. Ask them why do they believe in this product and why would users take an interest in it? This part of the stakeholder's interview gets deeper depending on the nature of their product.

4. What are your USPs (unique selling points)?

Make a list here of all the features of their product or service. Ask the stakeholders about the unique selling points and benefits of each. This helps you as a designer to believe in their business and the purpose of the business. Ask them why are their USPs different from other similar businesses? Ask if these USP's meet the needs of users and keep it short, clear, and concise.

5. Who are your users? What are you trying to help them achieve?

Users are important throughout the project. The initial phase of this user's research is to gather information about the stakeholder's understanding of the user's needs. What problem are they trying to solve for the users? How is their product or service will add value to the user's life? What will be the user's experience while using their product or service? These are all important aspects of the initial questions about understanding the users from the stakeholder's perspective and research. These are all important aspects of the initial questions about understanding the users from the stakeholder's perspective and research.

6. Who are your competitors? What do you like about them?

Consider the fact, most ideas are taken or already exist. Its how they are done makes the most of the difference. Understanding the competitors also helps to understand the business norms and its positive aspects. What is it that the user's like about their competitors and how do your stakeholder's product, service, and offerings differ from the rest of them?

7. What is the research that has already been done?

Research is crucial to the design process. It's what you begin with and use the same information to drive the project. Details of research done from the stakeholder's side help to understand their methods and gain initial insights about the business. Ask about the values, reasons, and discovery of their research. It's a designer's chance of learning, listening, discovering, and documenting the research knowledge.

8. Are there any design constraints? If yes, what are they?

With the vision, goals, and growth also come choices. Be upfront about these questions and do take them into consideration while making decisions during the design process. Let the stakeholder explain how they desire their website to speak to the users while also understanding their design flexibility.

9. Are there any technology constraints? If yes, what are they?

Is this even important? Doesn't everyone want the best for their website? Oh yes, they do but it's important to understand limitations and the possibilities. The stakeholders may have specific technology needs and it's good to know these at the initial stage of the design process.

10. What are the deadlines for the project? What is the process of approval for design and who will be approving them?

Ask the dates! Get details about the timeline. It's all right to give your projections later but it's important to know the stakeholder's expectations and be transparent about deadlines. It's also equally important to know the process of design approval and the people you will have to constantly be in touch with during the website design project.

Conclusion

The right questions asked during the stakeholder interview create clarity and constructive work relationships. These questions are crucial but are subjective to changes and can be framed according to the project. They also evolve as the stakeholder's reply. Ask more Why! and listen carefully throughout the process and avoid coming to any conclusions yet... This process creates a connection with the brand, website, and design. The information that is collected is not supposed to use as is. A designer can differentiate and create designs that are functional, effective, and workable for the users and the stakeholders. Most importantly do what design does — Solve problems. 

10 Soft Skills to Enable Positive Teamwork in Design
Category Items

10 Soft Skills to Enable Positive Teamwork in Design

Highlights essential soft skills that help design teams collaborate, communicate, and innovate effectively.
5 min read

Design and soft skills are deeply connected. Design teams should embrace this obvious fact and work in the direction of enabling team members to reach their full potential. Rather than encouraging team members to work individually design leads should embrace the need to celebrate the differences and encourage teamwork.

Encouraging individual work, stereotypes and not working as a team is a way of encouraging a particular way of thinking. This usually restrains team members from critical thinking, diversity of teamwork, ability to face criticism and preventing them from creating the best out of the design process.

A Great product comes into existence when the team faces challenges together.

It’s often stated that the quietest person in the room is the wisest. But how do you balance that in a team? How do you increase the collaborations during meetings when the loudest is evaluated as the most competent. So what are the ways to ensure everyone's participation and an equal chance to grow and contribute? That’s where the soft skills come in.

In this blog post, we will cover the different ways to enable positive teamwork through soft skills.

Be an Active Listener

Active listening is focusing on what the other person has to say instead of thinking about what to say next.

The skillset of active listening positively influences the relationship with clients, leads to a productive group discussion with team members, helps to gather feedback from users, and gaining insights from other colleagues.

In a Harvard Bussiness Review, What Great Listeners Actually Do is a great read for anyone working on their listening ability. Some of the major liners from the article are —

  • The best conversations are active.
  • Issues and differences should be discussed openly.
  • Question to demonstrate your understanding or to clarify things that they have said.
  • The person being listened should feel that the listener is trying to help, not wanting to win an argument.
  • Credible feedbacks are important throughout the discussion.
  • Capture ideas, ask questions and restate issues to confirm that the understanding is correct.
Person being listened should feel that the listener is trying to help, not wanting to win an argument.

Keep an Open Mind

Not all ideas during the discussion may seem workable or worth investing time in, but explorations and refinements are an unmissable part of the design process. Keeping an open mind can fuel this step.

An open-minded design discussion within the team is being willing to consider different approaches and different ways of thinking. It is being flexible and adapting new ideas and experiences. A designer with an open mind is a critical thinker, reasons creativity with logics and embraces the unexplored ways of doing things.

Open-minded design teams can be receptive to more than one potential solutions and figure out alternative methods to solve design problems. They pave a way for creativity to flow in naturally.

A designer with an open mind is a critical thinker, reasons creativity with logics and embraces the unexplored ways of doing things.

Empathize

“Empathy” is the first stage of the Design Thinking process, it means putting ourselves in the user’s shoes which can also be used within the design team and clients.

Empathy in a team is developed through active listening and observing. This skill needs curiosity and sincerity to create a connection while working together. Unlike with users, this doesn't require an analytical survey or detailed research. The skill to empathise with the people you are working with can be acquired through daily interactions.

It comes in naturally as you interact, understand and identify with each other's life, context and feelings, this way you will able to gain more emphatic ideas from each other and indulge in transparent discussions.

Empathy in a team is developed through active listening and observing.

Communicate Effectively

When we send an email, slack messages, snail mail or text to a colleague when you have zoom meetings and conference calls with the client it’s a skill to communicate yourself with clarity and politeness.

By clarity, it is to communicate in a way that requires fewer efforts from the other person to understand. By politeness is it to not cut off another person in the middle of a discussion, don't prove a point by proving your colleague wrong. The competition is not within the team, it's to deliver a unique experience and delivering a product as per the user's needs. It's important to make a switch from "I to We".

Make every piece of communication a seamless experience. This skill is essential because how you communicate, present your work and ideas really changes the way people perceive you as a professional. As you make it more enjoyable and stressfree it improves your credibility as a designer.

By clarity, it is to communicate in a way that requires fewer efforts from the other person to understand.

Embrace Change

In the ever-evolving world of design, it is important for designers to embrace change and learn from them. Changes being the only constant shape the world around us. They shape our work culture and the users we design for. They shape the user insights and mindsets. To provide a great experience it’s important to understand these changes and their effects.

In the post pandemic work scenario both employees and employers are likely to support remote work and will be continuing the work from home practice even after. These situations suggest new changed users and new researches to study their still evolving preferences, behaviour and the need to design accordingly.

They also suggest that we embrace these changes as a part of teamwork and support the team member’s journeys through the same.

Initiate Change by Learning

The Design industry isn't solely dependent on fancy degrees or credentials — some success is based on hard work, self-improvements, learnings, work ethics and consistency.

Self-learning helps when one encounters problems with new software, jargons, programs, management, organizing and so on. By enabling design with skills and willpower a designer can learn and contribute efficiently to their team and projects.

Initiate changes, introduce your new learnings and lead by example for everyone around you to grow. There is nothing that the internet doesn't know. It only requires intent, self-discipline and curiosity to grow at your own volition.

Feedback

Effective feedback should be clear, constructive and specific. It's a critical skill. Constructive feedback isn’t just about what you say, it’s about how implementable is the feedback you are suggesting.

The art of constructive feedback is in being able to empathize with others while also empathizing with the needs of a project. Non-constructive feedbacks can be uncomfortable for many designers.

Designers play a big part in improving the way feedbacks are processed and given. Instead of assumptions raise questions based on past experiences with the stakeholders and projects. Provide a base to your feedback with logical examples.

Lack of awareness of basic feedback skill would sound like "can you make it more interesting?" whereas constructive feedback would sound like "the images used on the career page are not representing our work culture. Let's show ourselves as a transparent, playful and relaxed agency to connect better with the candidates we hope to attract with it".

Be polite and make sure to offer a possible solution to the problem being addressed in the feedback.

An effective feedback should be clear, constructive and specific

Understand the core values

Understanding business values and user needs and finding the middle ground between them should be a part of a designer's skill set. It should come naturally after some projects and should be made accessible, presented during design discussion with the team.

Design leads should be able to speak to business needs and address them during the discussions. It's crucial that everyone on board in the project should evaluate how they can contribute and do their part to encourage business growth.

It's crucial that everyone on board in the project should evaluate how they can contribute and do their part to encourage business growth.

Respect Boundaries

Workplace boundaries define and develop a meaningful relationship between team members, clients, managers and other colleagues while also maintaining positive personal energy and flexible limits at work.

Mentioning some favourites from an article from Quartz, How to set healthy boundaries at work —

  • With communication and practice, you can learn to set self-honouring limits without alienating people or losing your paycheck.
  • Make a request of yourself or another person about what needs to change.
  • You need to understand the other person’s needs and desires in addition to being up-front about your own perspective.
  • Building boundaries takes time and practice.

Once you understand your team members boundaries and convey yours, respect them. How you value someone’s boundaries and maintain says a lot about your professionalism and work ethics.

Forgiveness

Holding on to a mistake encourages negativity, lack of collaboration, disorientation during discussions and passive-aggressive behavioural issues. When people in an organisation remember every small slip, they cause more harm to the team than the person who did or did not do the mistake. Such environments lead to work cultures based on blame and resentment.

Forgiveness doesn't mean lowering the bar — it indeed creates a safe place for excellence to dwell in an organisation. Forgiveness fuels positivity, amiable group discussion and productivity.

study by the American Journal of Health Promotion promotes the power of forgiving to improve well-being and productivity at a workplace. Another article suggests the inability to forgive negatively affects individuals and organizations as a whole. It is important to sort a grudge and collaborate in a healthy work environment.

Forgiveness doesn't mean lowering the bar — it indeed creates a safe place for excellence to dwell in an organisation. Forgiveness fuels positivity, amiable group discussion and productivity.

There are many more soft skills than those discussed here. To be a successful designer you have to work and develop both, hard and soft skills and create a positive work environment for your team members. A view that includes varied perspectives of the whole team, as well as project managers, developers and anyone who aspires to contribute should we respected and listened to. That’s how you lay a strong foundation of teamwork and that’s how sustainable ideas originate.

The Process of Redesign—Part 2
Category Items

The Process of Redesign—Part 2

Key lessons from redesigning digital platforms for clarity, structure, and performance.
5 min read

The process of redesigning a website requires a cycle of understanding the existing product from interviewing the stakeholder to designing the product and delivering the design for development. In the process of redesign — Part 1, we started with understanding the definition of a redesign, the factors that possibly lead to a redesign and the initial steps of interviewing the stakeholders, creating a creative brief and making informed strategies to fuel the process. In this post, we will be elaborating on the further steps that complete the process of a redesign.

Design

To redesign the old design means removing everything that doesn’t facilitate better results for a deeper emotional response from the users. It’s important to identify and define the parts of the current design that may be working well from the ones that are not. Some of the major focus points for the same are —

  • User experience
  • Accessibility
  • Intuitive Navigation
  • Conversion Rate Optimisation
  • Impactful UI - As form follows function
  • Aesthetics
  • Evoking the right emotions
  • Content Strategy 
Design Discussion-redesign

Create an aesthetic language and usability design for the homepage with artboards, mood boards and color palettes. Brainstorm the keywords and sketch as much. The more ideas the better.

To move ahead with the core concept get the stakeholder's feedback. The other components and elements of the website move in the same direction as the homepage. Once the homepage is finalised the concept then graduate into being a prototype close enough to get a strong sense of the concept's core potential.

The steps involved in the process of an effective design solution is elaborated and explained in our post — The Design Process - All Work, All Play

Testing

Usability testing helps to determine the usability of design and see if users can orient in the UI and use it. It's usually done with prototypes on the target users defined during the research. Usability testing is an ongoing process to find out concrete responses to the redesigned website.

It's important to test the design solutions of a redesigned website in a tangible real-world. Testing allows experimenting with websites potential users in both qualitative and quantitative phase. There are several methods of testing a website's usability and different kind of testing is conducted to achieve varied results —

  • Guerilla Usability Testing
  • Steve Krug’s User Testing
  • Usefulness Testing
  • Desirability Testing
  • Eye Tracking

Testing begins early in the redesign process to minimize any error possibility. It gives an in-depth evaluation of the website. Usability testing also allows designers or developers to discover problems before they are coded in order to improve the usability of the website and create a good user experience. The purpose of testing is simple, it is to provide solutions for any problem that may come in future.

Here are some of the online available usability testing tools —

UserTesting: The Human Insight Platform

Remote User Testing Platform | Userlytics

See your website through other people's eyes

UserZoom | User Experience (UX) Research Platform

Creating a Design System

Putting the design elements into an understandable organised system is important. A design system is an evolving guide that determines the composition of a website. A clearly organised design system converts the website elements into a cohesive toolkit which is used by the teams as the product goes forward.

The composition of the system is different for every project, it includes guidelines for everything from style palettes — colors, shadows, type scale, spaces, fonts, error message styling to the component library — layouts, grids, coding conventions, icons, buttons and everything else.

Design systems save time and are created to overcome inconsistencies while also speeding up the workflow. The reusable tool kit also makes sure that the current redesign is flawless. It provides a convenient starting point for the future.

Design system

 

Apart from the design system, it's important to provide all details about the redesign in-person. It helps the stakeholders and future teams understand the flow of the website and get tactical training. This clears the goal of bringing in transparency in redesign solutions.

No two redesigns of any websites are similar. Taking all steps of the redesign process usually works to create a successful website. A detailed interview, well thought of and discussed creative brief, a well-informed strategy and a flexible design process brings in a stress-free workflow and helps to stay well documented and meet deadlines until the handoff.

How Design Influences the Conversion Rate of a Website
Category Items

How Design Influences the Conversion Rate of a Website

Good design increases conversion by improving clarity, flow, and trust.
5 min read

A company's conversion rate and revenue alignment are important for a successful website. The conversion rate is the ratio of total visitors who take desired actions. As a general categorisation, there are two different types of conversion — Macro and Micro.

Macro conversions include visitor's actions aimed at completing tasks which directly influence a company's revenue. Those actions include direct purchases, signing up, taking a trial, being directly contacted, filling out the contact us form and when somebody requests for a quote. Micro conversions are actions that accelerate macro conversions. It includes blog subscription, social media followers, case studies, e-books, reviews and views.

In short, If it doesn’t convert, it's not working. To make a website profitable and worth the hard work --   designers, the marketing team, sales team and business owners should be concerned about both micro and macro conversions.

Design plays the basic and the most important role to influence conversion. The design includes — looks, aesthetics, typography and the first impression of a website but it also includes usability, user engagement, key performance indicators, clear navigation based on data of user research, consumer insights, short term goals, long term achievements, marketing goals, persona profiles and design trend reports. In this post, we are going to cover 8 factors through which design and designers influence the conversion rates of a website.

Know the Goals

First things first, know your goals. Before starting a project, a designer should understand all the objectives of a business. A detailed stakeholder's interview and analysis of the information is the key beginning. Next step is to place the goals in the ladder of priorities — the main objective of the website, secondary and tertiary goals. The website should be designed on the basis of the priorities defined and associate programs and campaigns that serve these goals to make sure that the user sees exactly what needs to convert into leads.

zendesk landing page

Know your Users

Knowing the users is a comprehensive and multilayered activity. User research aims at collecting information about the potential target audience of the product. To know the users a designer has to turn into a researcher or work in parallel with the research team to get maximum information and it's analysis to create user-friendly design solutions.

The basic understanding of the users and getting deeper into details of the core users is vital for design. These are a few out of many things that define the user research -

  • Who are the potential users and audiences?
  • Gender segregation.
  • What is their age group?
  • Understanding the preferences of potential users.
  • Understanding the psychological aspects.
  • Understanding the demographics and the market.

Many important elements of the website are designed and derived by the analysis of the user research - like colors, style, layouts, emotional aspects and the basic sense of the interaction with the defined group. It makes the website more engaging. The visual outcome has the potential to create an original and recognisable style. It helps to get the website the attention it needs. If the landing page design is a challenge for the users to understand, the website will probably drive the users away.

Understand the Color Theory

Colors are predominant, are a source of information and evoke the right emotions in a website. People make up their minds within 90 seconds of their initial interactions with a website. About 62-90 per cent of the assessment is based on colors alone. Careful use of colors contributes only to differentiating products from competitors, influences moods and feelings and also the attitude towards the brand and its product.

Choosing the right color scheme for a website and creating a sense of aesthetic balance amongst landing page, backgrounds, graphics, headline, typography, buttons, borders, products, popups and more are an extremely important aspect to drive conversion.

The fact that designers should understand color theories is unarguable. Read the details of color theory in our posts about the same in An Understanding of Colors for UI Design. and From Hue to Color Story - A Basic Understanding of Colors.

Understand the Color Theory

Readability

A readable website with clarity, high-contrast typography and logical hierarchy of information makes it easier for the user to consume the content and understand the objectives of the website. A designer should make sure that the heading, sub-heading and important content is different from each other and still balanced through different fonts, font sizes and colors to look like a well-synchronised design. Fonts that are consistent on a website helps the user understand the motive behind them naturally.

Another important aspect of readability is the use of appropriate words. As per many surveys, the users have more choices and reduced attention span. This is where a good copy comes into play, good copywriting leads to a better website.

This is how good and appropriate copy influences to create a good design which leads to better user experience.

  • An actionable and focused copy helps tell the complete story.
  • Copywriting helps the user understand the needs.
  • It helps to explain the next steps.
  • Copy, voice and tone as an afterthought could misdirect the objectives.
  • Copy elevates, directs and influences the success of a website.
sketch app landing page

Clear Navigation Flow

The simple the better. It's through navigation design that the user explores - enjoys the website and gets access to the important information. Overwhelming the users with many choices and complicated navigation can seriously impede a website's conversion rate.

From the breadcrumb menu to dropdown, tabs to everything on the website should be designed to achieve a simple, time-saving, user-oriented flow. The key to well-designed navigation is to keep the flow simple, easy to use, predictable and consistent.

nike navigation menu

Focused Call to Action

A well-designed call to action button is meant to be persuasive, intuitive and should motivate the user into the desired action. Call to action buttons are usually given a prime place in the website and are highlighted enough to sign up, downloads or make a purchase etc.

For the right placement of the call to action button, a designer should understand the user's goals and examine how each action progresses towards it. The key is to provide the right visual weight to all buttons and to make the flow intuitive.

Notion Pricing page

Keeping up with the Trends

If the design is inclined towards trends, then trends have to be studied ahead of the season of the launch of the website. Trends go down very well with the design and the always-changing user mindsets.

  • trends tend to exponentially increase in the popularity of a website over time.
  • Since trends tail off after a specific duration they work best with campaigns, secondary and tertiary goals of the website design.
  • Designing with trends facilitates the users with relatable content for that period.
  • Trends give websites a conversion mechanism to expand their reach quickly.
  • Trending designs have a quick way of becoming famous and increasing discoverability.

Conversion through trends has to be done quickly and should serve the period it is designed for. Trends wear off quickly but moving ahead with consistent trends often result in loyal members and visitors of the website.

amazon sale banner

Studying Analytics

One design doesn't fit all and can't be universally loved. A designer's goal should be to make the design intuitive, easy to access and well balanced. The analytics come in to understand what works and what does not. This helps a designer to prioritise design needs according to the users and the right metrics.

  • Analytics show concrete problems, that design can usually fix.
  • Analytics show user behaviours within diverse categories and regions which make design decision easier.
  • With the analytics, every design decision has a valid reason and user data to back it up.
  • Analytics insights help pay attention to the right details both negative and positive.
  • Analytics show how design affects the numbers required.
  • It's easy to learn the needs and unlearn the not requires aspects of the website.
  • Analytics data answers very specific questions and helps to understand precise needs.

As an example to the above points, analytics show what are the buyers dropping and picking up from the website, it exactly shows how many visitors are converting into sales and which pages get the maximum attention span. It also exactly shows which users are not getting converted into sales or signed-in users and that helps in making the right improvement and enables testing with the real users which is what the while design is centred around.

Analytics should be aligned from the beginning of the project. Designers should not limit the research methods to get analytics. Mix and match the methods and processes, speak with the stakeholders to get the concrete data to solve the issues through design.

As with all the things online, new website designs, technology, devices and trends bring in different challenges with every project. There is no single way of creating a perfect website but an approach to prioritise the objectives, goals, users, aesthetics, usability, functionality, analytics and design trends are likely to yield intuitive and responsive design influencing conversion rate of a website.

The Process of Redesign—Part 1
Category Items

The Process of Redesign—Part 1

Redesign frameworks that modernise platforms while keeping performance and usability central.
5 min read

Design is about creating rational and compelling solutions. Redesigning is propelling the same process with a new approach. It's important, to begin with, understanding redesign before making the important decision.

The aim of redesigning is to create a better experience for users and improve usability. The factors that lead to the decision to redesign should be focused on increasing the user base by creating and adding new content. A redesign should shape both quantitative and qualitative design needs. The end result of a redesign should always improve the functionality by solving the existing problems.

The sole purpose of redesigning is not to rebrand, change aesthetics, look or feel and change placements of the existing elements in the layout. Although these can be a part of the whole redesign process and should contribute to content consumption and usability. 

The factors to consider for a redesign.

There are several factors that result in an unsatisfying website or app —

  • If a website or an app is not bringing in enough traffic.
  • If the traffic is concentrated on the wrong pages.
  • If the current components on the website do not contribute to generating enough leads.
  • Change of goals and vision for the business.
  • New marketing campaigns do not match with the current tone of the website.
  • Usability issues.
  • Neutral or bad User experience reviews. 

The aim of a redesign.

The aim of the redesign is to bring in positive changes to the website or an app. —

  • To bring reformation in business.
  • Improve user experience.
  • Put more emphasis on content.
  • Design optimization for the reading experience
  • Optimization for search engines.
  • Increase conversion rate.
  • Surge speed.
  • Add to the core accessibility features.
  • Augment product engagement.
  • Built sustainable engineering developments.
  • Add the features of accessibility.
  • Introduce new services.
  • Empower the core community.

There could be several other factors that could come in the way of an absolutely engaging website or app. To figure out those reasons the first step to the redesign process is talking to the stakeholders.

Know your stakeholders.

This is the first and most crucial step. The stakeholders usually have clarity about what hasn’t worked so far, what has and what exactly needs to be reformed! The role of the design team here is to adapt, learn and understand those details.

This is the process of asking questions and gathering all the information from the stakeholders. The answers and information collected during this meeting drive the direction for the rest of the project. It’s important to ask many questions and note down or record all the information received. The questions can be framed with the below mentioned key points and should be prepared ahead of the meeting.

  • Main pain points of the current design.
  • Vision for brand and business.
  • Core values.
  • Brand guidelines and motive.
  • Motivations for a redesign.
  • Existing user persona.
  • Target audience.
  • Data from analytics.
  • Style guide.
  • Good points of the current design.
  • Must keep and must-haves.
  • Purpose of team and community.
  • Short them goals and long term achievements.
  • Deadline.

Picture of a questionnaire for the stake holders.

An attachment of the stakeholder-oriented questions. We modify these questions based on stakeholder's initial brief. What works great with one stakeholder may not work with another. 

QUESTIONS FOR STAKEHOLDER INTERVIEWS.pdf

 

Once the information is thoroughly collected it gets processed in meetings with the stakeholders and discussions with the design team, project managers and other team members which results in a concrete creative brief. 

Creative Brief

The creative brief is based on the information collected from the stakeholders, analysis of the current website, competitor analysis and user research.

The aim of this step is to set clear goals, choose the right key metrics and decide a deadline for the submission of the project and present them to the stakeholders.

The agreed common goals, key metrics and the identification of deliverables and transparency work in favour of the project and the alignment between stakeholders, teams, designers, decision-makers and project managers.

A concrete creative brief keeps all on the same page and everyone remains focused as well with aligned deadlines. It’s a document where details are updated when and if new changes are agreed upon.

A picture of a person creating the creative brief on the laptop

Strategising

Strategy informs design based on reality. It’s the foundation that everything the design creates is built on. The aim for this part of the process is to create a stepwise strategic plan which fuels the process of redesign.

All the decisions taken at this step are backed by logical and reasonable outcomes of the stakeholder's interview and the creative brief based on detailed user research, competitor analysis and analysis of the existing website.

The time and effort put in the step of strategising results in unified documentation which guides stakeholders and designers and all team members of the tactical decisions, priorities and helps overcome the identified and undefined obstacles based of research, facts and analytics.

A picture of a screen with a planned strategy for the redesign project.

The process of redesign further involves the process of design, creating a system and a brief about delivering assets which will be included in the next blog post, the process of redesign — part 2. 

Stay safe!

Understanding Colors for UI/UX Design: A Comprehensive Guide
Category Items

Understanding Colors for UI/UX Design: A Comprehensive Guide

Using color effectively in UI design to improve readability and user focus.
5 min read

Colors are a way of generating emotions and have the ability to engage consumers. When it comes to designing an engaging user interface, color is considered to be the most important aspect. The understanding of color theory can be a challenge, but when used in the right context, colors can convey enhanced meaning and add value to web products.

As we also explained in our previous blog post — From Hue to Color Story - A Basic Understanding of Colors — color is a powerful tool to communicate a specific mood and evoke feelings in consumers and the right use of colors makes a website or an application look more natural and put together.

As touch becomes restricted, it's important to consider how to make a website or an application more noticeable, promote business and engage the right users on the screen through colors.

The Effects of Using the Right Colors.

1. Colors coordinate the basic experience for web products.

The basic mood, overtone, undertone, experience and the concept of an application or a website are coordinated through colors. Colors create an overall harmony and set a recognisable powerful language for a brand.

A Research by the Institute of color research - CCICOLOR reveals that people make a subconscious judgment about a person, environment, or product within 90 seconds of initial viewing and that between 62% and 90% of that assessment is based on color alone. 

For more detail on the CCICOLOR research -- https://www.colorcom.com/research/why-color-matters

2. Colors Influence Clarity.

The right selection of colors is an important aspect for readability and accessibility of the web products. Aesthetically stimulating color palette and balanced color stories influence usability, navigation, interactions and provide clarity of content to users.

3. Designing for a Specific Gender.

According to Kissmetrics, both men and women had the same general preference when it came to light and dark colors. The experiment also showed that women gravitate toward soft colors, while men like bright ones. What works on one site or app, doesn’t necessarily work on another. A color palette based on research as per gender results in captivating websites and apps.

For more detail on the Kissmetrics research -- https://blog.kissmetrics.com/wp-content/uploads/2011/03/true-colors1.pdf

4. Designing for a Specific Culture.

The color psychology as we know differs from location to location, culture to culture and society to society. When it comes to designing a web product for a specific culture, it's important to consider the traditions and beliefs of the place to make the right selection and make sure that the colors are interpreted as they are designed to be.

Colors have absolutely opposite meaning according to the region they are placed in. For example, In some of the Asian countries, white color implies sorrow and is often used during obsequies while in European countries white signifies purity and is often seen during weddings. By acknowledging a culture's perception of color UI designers could engage right users by avoiding any possible misinterpretation about the product.

Colours of Culture

Make Right Color Selections.

1. The Golden Ratio of Colors

The golden ration creates harmony and proportion through colors. It can be applied to many compositional elements in UI design.

While using the 6:3:1 Rule, designers have to choose a dominant color and use it in 60% of the space, a secondary color in 30% and a final color in the remaining 10%. The 6:3:1 rule eases the eye of users to move from one point to another comfortably.

Read in detail about the Golden ratio in color -- https://www.canva.com/learn/what-is-the-golden-ratio/

Right Color Selections

2. Blue Works

Blue is the lifesaver color in UI design and has a significant value in design. It is a cool color and some of the most frequent websites and applications - Facebook, Microsoft, Safari, Twitter, Shazam etc. have used shades and tints of blue as their base colors because blue as a color influences trust, is easily accepted and gives a sense of virtual realism to the users. Many surveys also show the majority of people see blue as their favourite color. Most common types of colorblindness (Protanopia and Deuteranopia) can also see the color blue.

characteristics of colour blue
Resource: https://www.nhs.uk

3. Use Colors with a Purpose

No color is bad except when the wrong color is combined with the wrong UI design. All colors have unique characteristics and should be used with a purpose. When designers, design interfaces, the color libraries mostly have established meaning for colors such as red, green and yellow to show specific information such as error, notification, and caution.

The characteristics of a color used with another color help change that meaning completely. Is why it's important to understand how different color schemes create different harmonies, create a language for branding and deliver the right message through the web product meaningfully. As for example soft pastels and naturally derived colours have the ability to relax and calm the body and mind. These can be used on wellness websites and applications. 

Soft pastels and naturally derived colours
Resource -- https://www.eatingbirdfood.com

4. Simplicity

Simple color combinations improve user experience. If the human mind finds an application is easy to look at half of the job as a designer is done. A simple color scheme involving two contrasting colors or a monochromatic color scheme isn’t overwhelming to the eye and makes content easier to consume. Conversely, having too many colors in too many places creates a complicated interface and confuses the user.

For example using black and white colors make a websites and apps appear classic and simple. A monochromatic color scheme with shades and tints of purple can exude a magical. A monochromatic yellows palette depicts happiness and represent joy, intelligence, brightness, energy, optimism, and happiness. Different characteristics can be achieved with different hues depending on the initial concept and requirement of the project. 

Simple color combinations

Selection of colors based on Color Schemes

Monochromatic

Monochromatic is the simplest of all color schemes, as each color of the palette is derived from the same hue. This scheme goes well with concepts looking for a clean and cohesive look.

Possibilities for creating colors through a monochromatic color scheme is infinite. While creating shades for this color palette — darken the hue with black, for tones — desaturate with grey and to create tints lighten the base color with white.

Simple color combinations
Simple color combinations
Monochromatic websites

Analogous

An analogous color palette is designed with picking up colors with low contrast values of the same vibrancy. It is commonly used as a background for web pages and banners.

Analogous
Analogous colors

Complementary

Complementary colors are opposite colors with strong contrasting values. This color palette comprises of colors which are placed in front of each other on the color wheel. It is used when components in UI design need undivided attention. For example, A red button on a white background is likely to stand out on any interface than aqua or shades of grey.

Complementary colors
Complementary colors

Split-Complementary

A split complementary color scheme is one where one primary color is used with the two analogous colors.

The palette is formed by picking two opposite bold colors and a third color next to any one of them. For example yellow works well with red-purple, blue-green, turquoise-violet and red looks good with green-blue-purple. These are fairly some of the examples, the possibilities with the split-complimentary color scheme are endless and depends on the concept of the web product and designer's perception of the end result.

Self complementary colors
Split-Complementary
Resource: shorturl.at/uwOT6

Triadic

Triadic color scheme is designed with three colors which are placed equidistant from each other on the color wheel. Triadic is considered to be one of most diverse and difficult color scheme. Most designers who use this color scheme select either two warm colors and one cool, or two cool colors and one warm. Trident color scheme usually creates overwhelming and visually muddled UI interface designs.

Triadic
Triadic
Resource: shorturl.at/uwOT6

Tetradic/Double Complementary

The tetradic color scheme is commonly used by experienced designers since it's slightly hard to balance palette with this scheme. It is created by using two sets of complementary pairs. The four colors from the color wheel should form a rectangle to achieve a balance tetradic color scheme. This hard to create scheme creates an appealing vibrant effect. 

Tetradic Double Complementary

Custom Color Palette

Creating a color palette as per the concept isn't as hard as it sounds like for the UI designers. Nature is a reliable source of inspiration for the same. A picture of a landscape reveals how colors fit in together naturally and in the right proportion to each other and are visually soothing and relatable for users. A color palette can also be created with the help of various tools available online.

interaction
Resource: https://color.adobe.com/trends

Adobe Color CC— Create color schemes with the color wheel or browse thousands of color combinations from the Color community

Coolors.co - The super fast color schemes generator— Generate perfect color combinations for your designs

Paletton - The Color Scheme Designer— In love with colors, since 2002. A designer tool for creating color combinations that work together well.

Designing For Color Blindness

Around 8% of men and 0.5% of women in the world are colorblind. How the app or a web page appears to the users with visual impairments is extremely necessary.

UI designers should responsibly design multiple visual cues to communicate important states. Colorblind users see the colors different from as they are which is why colors solely shouldn't define consumable information instead use other elements like strokes, patterns, text, texture and pattern to describe the action of the content.

Adobe Photoshop has useful tools to simulate colorblindness, the different feature of photoshop allows designers to see the screen as it will look like to users with a different form of colorblindness.

Other colour-blindness simulators that can be used while designing for accessibility —

Stark — a paid Sketch plugin that will let you simulate different types of color blindness.

Color Oracle — a free color blindness simulator. It uses the algorithm for simulating color vision impairment, so you can see colors as they are seen by colorblind people.

Toptal’s color filter — this online tool lets you test your website and shows you how people with different color blindness will see your pages.

Conclusion

As visually appealing as the colors must be they should also contribute to designing usable and clear interface. For a UI designer, the basic tool for the selection of appropriate colors is a good color wheel. The primary colors of the color wheel comprise of Red, Blue, Green and the secondary colors are Green, Orange, Purple. UI designer should avoid colour-coding small elements with complicated colors, and instead use black, white and grey for fine details.

Color choice can be personal, cultural or conceptual and color theories are a part of complex science. Implementation of both art and science creates effective designs with complete knowledge and understanding of the final color palette.

Higher-Ed
Healthcare
Non-Profits
DXP
Podcast
BizTech
Open Source
Events
Quality Engineering
Design Process
JavaScript
AI
Drupal
Culture