Category : UX/UI Design

Designing for Vision Pro: the coming spatial experience

Oct 12,2023 / By Parth Khandekar / No Comments

As the real and virtual worlds continue to converge, Apple has introduced Vision Pro, a device designed to deliver immersive mixed-reality experiences. Vision Pro enables endless possibilities for exploring human-to-system interactions and spatial dynamics. Users can interact with the digital world more naturally using the mixed-reality headset. It overlaps digital content in the real world, allowing users to simultaneously see and interact with both worlds. Vision Pro is slated for limited release to the public next year, but Apple has already given a demo to select developers.

Vision Pro features two high-resolution micro-OLED displays that project images directly onto the user’s retinas, creating a “screenless” (screen without a screen) experience. The headset has 12 built-in cameras for tracking the user’s head, eyes, and hands, a LiDAR scanner for depth perception, and an Apple M2 chip with 10 CPU and 32 GPU cores.

Vision Pro is designed with accessibility at the center, using gestures, voice, and combinations of these input modes as critical enablers. This was showcased in the launch event video, where users could interact with the headset using gestures to browse the web, watch movies, and play games. Designing for Vision Pro requires understanding these input modes and providing solutions for users to have a seamless journey.

Source: MacRumors Apple Vision Pro Gestures

Designing for a spatial experience

Design principles for traditional screens may not work for the future of spatial experiences, which are more immersive and interactive. Designers need to adapt these principles to consider the unique features of spatial experiences. Spatial experiences allow users to interact with the environment more naturally, so designers must create interfaces that are easy to use and understand.

Vision Pro’s spatial capabilities allow designers to create visually captivating and user-friendly interfaces that feel intuitive and natural to navigate. This focus on user-centric design enhances the user experience across various applications. Below are some key aspects to consider while designing for glass-style UI:

Iconography

To create a seamless user experience, Apple has reimagined the feedback mechanism for icons on the home screen. When a user looks at an icon, it expands as if it is being hovered over. Designers design icons with subtle depth by adding specular shadows and highlights.

To design a great icon, start by creating multiple layers. The system uses these flat layers to create a three-dimensional effect. The icon should be converted to 1024×1024 pixels, with transparent foreground layers. Do not use large regions of semi-transparent pixels, as they will blend with the shadow behind them.

Consider these additional recommendations when designing icons:

Maintain a uniform color scheme and style throughout your icons.
Make sure your icons are clear and easy to understand.
Use high-quality images and graphics.
Test your icons on different devices and screen sizes to ensure they look good everywhere.

Source: App icons | Apple Developer Documentation

Glass panels design

Apple has introduced glass material to create a more spatial and lightweight user experience. This material allows users to see what is behind a window, such as other apps or people, without feeling suffocated.

Therefore, when designing an app window, it is essential to avoid using solid colors. Too many opaque windows can make the interface feel heavy. Instead, use a lighter material to bring attention to interactive elements, such as buttons, or a darker material to separate sections of the app.

For example, if you want to design a lock-up with a lighter button, you can place it on top of the glass material. Or, if you’re going to create more contrast, you can use a darker cell behind the button. However, it is crucial to avoid stacking lighter materials on top of each other, as this can impact legibility and reduce contrast.

Consider these bonus tips for designing with glass material:

Use glass material sparingly. Too much of it can make the interface feel cluttered.
Use glass material to create a sense of depth. For example, you can use a darker glass material for the background and a lighter glass material for the foreground.
Use glass material to highlight essential elements. For example, you can use a lighter glass material for buttons or other interactive elements.

Source: Materials | Apple Developer Documentation

Legibility

Typography

The font-weight can be slightly increased to improve text contrast against vibrant materials. For example, on iOS, regular weight for the body text style must be used; on this platform, a medium can be used. And for titles, instead of semi-bold, bold can be used. This makes the text more legible, even when displayed on a vibrant background. System fonts, which are designed for optimized legibility, can also be used.

Vibrancy

Vibrancy is another crucial detail for maintaining legibility. It enhances the foreground content by bringing light and color from the background forward. On this platform, vibrancy updates in real-time to ensure your text is always legible, even when the background constantly changes. Vibrancy can indicate hierarchy for text, symbols, and fills. Primary vibrancy can be used for standard text, and secondary vibrancy can be used for less critical text.

Pointers for using typography and vibrancy:

Use a heavier font weight for text that needs to be legible, such as body text and titles.
Use system fonts or other fonts that are designed for optimized legibility.
Use vibrancy to brighten foreground content and make it stand out from the background.
Use primary vibrancy for standard text and secondary vibrancy for less critical text.
When using custom fonts, make sure they are designed for readability.
Avoid using small or lightweight fonts, which can be challenging to read, especially on large screens.
Consider using a darker shade for the pop-over background to make the text more legible.

Source: Typography | Apple Developer Documentation

Colors

When designing a glass-style UI, use white text and icons on a colored background. This will make the text and icons stand out and be more legible.

Use system colors whenever possible. System colors are designed for legibility and look best on a glass background.
If you need a custom color, use it sparingly and make sure it contrasts nicely with the background.
Avoid using dark colors for text or icons. Dark colors will blend in with the background, making the text and icons challenging to read.

Here are some additional tips for designing glass-style UIs:

Use a light overall color palette. This will help to create a sense of spaciousness and airiness.
Use transparency and blur effects to create a sense of depth.
Use shadows to add dimension to the UI.
Use gradients to add interest and visual interest.

Source: VisionOS – Apple Developer

How Vision Pro can transform businesses

Businesses of all sizes and across some industries are excited about the potential of Apple Vision Pro, which is still in its early stages of development. The technology has the potential to transform operations, improve customer experiences, and boost overall performance. Still, which industries will most successfully adopt it remains to be seen.

Entertainment

Create immersive gaming experiences that blur the line between the virtual and real worlds. To illustrate, game developers can use Apple Vision Pro to create realistic first-person shooter games where players can interact with the environment lifelike.
Create interactive storytelling experiences. Filmmakers can use Apple Vision Pro to create 3D movies, transporting viewers into breathtaking cinematic worlds.
Provide real-time translation of foreign language text. For example, language learners can use Apple Vision Pro to get a real-time translation of foreign language text while traveling or interacting with people from other cultures.

Source: How will Apple Vision Pro VR influence industries | Merge Development

Education and training

Provide students with interactive learning experiences. For instance, teachers can use Apple Vision Pro to take students on virtual field trips to historical sites or to conduct experiments in a safe and controlled environment.
Offer virtual field trips. For example, students can use Apple Vision Pro to visit museums or other educational institutions without leaving their homes.
Provide real-time translation of foreign language text. Concretely, language learners can use Apple Vision Pro to get the real-time translation of foreign language text while taking a class or reading a book.

Healthcare and medical

Provide realistic surgical simulations and training scenarios. In other words, doctors and medical students can use Apple Vision Pro to practice procedures without risking harming a patient.
Offer remote consultations with patients. For example, doctors can use Apple Vision Pro to consult with patients in remote areas.
Visualize and analyze medical data. For instance, researchers can use Apple Vision Pro to visualize and analyze medical images and data to understand diseases better and develop new treatments.

Source: How will Apple Vision Pro VR influence industries | Merge Development

Real estate and architecture

Give potential buyers virtual tours of properties. Real estate agents can use Apple Vision Pro to give potential buyers a 360-degree view of a property without meeting them in person.
Collaborate with clients and stakeholders on 3D design projects. Architects can use Apple Vision Pro to collaborate with clients and stakeholders on 3D design projects in real time.
Visualize furniture and decor in a physical space. For example, interior designers can use Apple Vision Pro to visualize how furniture and decor will look in a room before making a purchase.

Meetings

Join virtual meetings from anywhere. For instance, remote workers can use Apple Vision Pro to join virtual discussions from anywhere.
Collaborate in real-time and share information. For example, participants in virtual meetings can use Apple Vision Pro to collaborate in real time and share information.
Track customer behavior and improve the shopping experience. Concretely, businesses can use Apple Vision Pro to track customer behavior in a retail store and use that data to enhance the shopping experience.

Source: Apple’s Vision Pro: Revolutionizing Industries Through Spatial Computing| ELEKS

Finance and banking

Visualize financial data. For example, financial analysts can use Apple Vision Pro to visualize financial data to understand the market better and make informed investment decisions.
Help clients track their spending. For example, personal finance managers can use Apple Vision Pro to help clients track their spending and reach their financial goals.
Visit virtual bank branches. Concretely, customers can use Apple Vision Pro to visit virtual bank branches to conduct transactions or speak to a banker.

Retail and e-commerce

Try on clothes and accessories before making a purchase. To illustrate, shoppers can use Apple Vision Pro to try on clothes and accessories before purchasing.
Provide personalized shopping recommendations. Retailers can use Apple Vision Pro to provide personalized shopping recommendations based on a shopper’s past purchases and browsing history.
Offer in-store navigation. For instance, businesses can use Apple Vision Pro to offer in-store navigation to help customers find the products they are looking for.

Source: Apple Vision Pro and The Future of ECommerce (codilar.com)

Vision Pro: the flip side

Innovation can be exciting, promising a brighter future with endless possibilities. However, carefully considering the potential consequences of new technologies is essential. While innovation often brings benefits, it can also come with risks, such as privacy concerns, surveillance risks, and impacts on mental health and social isolation. Balancing progress with responsibility when developing and using new technologies is essential.

Comfort and ergonomics

Early reports suggest that the Vision Pro is well-built but slightly uncomfortable to wear for extended periods. The headset is front-heavy due to its metal construction, which could make it difficult to wear for long periods. Additionally, the headset’s weight distribution and heat management could further impact user comfort. If the Vision Pro is not designed to be comfortable, it may limit its appeal to consumers and businesses.

Privacy at stake

The Vision Pro raises fundamental concerns about personal privacy. The headset’s ability to project floating screens onto our vision while observing our environment could collect vast data about us. This data could include our eye movements, facial expressions, and surroundings. The potential for this data to be used to track our movements, monitor our behavior, and even identify us is a serious privacy concern. Establishing robust safeguards and ethical boundaries is essential to protect individuals’ privacy in the digital age.

Mental health and social isolation

While technological advancements can enhance our lives, we must also consider their potential impact on mental well-being and social dynamics. The Vision Pro’s immersive AR experience could be a double-edged sword. On the one hand, it offers captivating virtual overlays of reality that could tempt users to immerse themselves in a captivating digital realm. On the other hand, this allure could come at the risk of isolating individuals from their physical surroundings and authentic human connections. As we increasingly detach from the present moment and substitute genuine interactions with virtual experiences, the potential for social isolation and its associated mental health consequences is serious.

Source: Apple Developer Forums

Apple’s Vision Pro hasn’t even been released yet, but the company is already planning a smaller and lighter version of the headset and is deep into work on follow-up products.

Conclusion

Apple Vision Pro can redefine how we interact with technology in a human-centric way. Its spatial capabilities allow designers to create visually appealing, user-friendly interfaces that feel natural. This focus on human-centric design will enhance and transform businesses of all sizes and industries by enabling immersive, interactive, and personalized experiences in various applications, from gaming and entertainment to education and training. While Vision Pro can be a powerful tool for good, it is essential to remember that it is also a new technology with potential risks. Our collective responsibility is to ensure that Vision Pro is used responsibly in a human-centric way.

UX/UI Design

RAPID: an Accelerated Approach to Digital Design Thinking for Innovators in Every Industry

May 22,2023 / By Chaitrali Vijay Palande / No Comments

In today’s fast-paced world, innovation isn’t just a business goal; it’s a necessity. Producing new products, improving existing ones, and creating solutions for future needs make Digital Transformation a requirement in every industry.

What is Digital Transformation?

At Robosoft Technologies, we define digital transformation as “the incorporation and unification of digital technologies into all areas of a business resulting in positive changes in how businesses operate and deliver value.”

We know, we know. That’s a mouthful. But, more importantly, it’s an informative reminder that our current consumer culture demands that businesses constantly challenge the status quo. As Howard King, head of data and analytics at Rufus Leonard, wrote in an article for The Guardian, “Businesses don’t transform by choice. Why would they want that? It is expensive and risky! They transform because they have no alternative.”

Because we understand the necessities and risks surrounding Digital Transformation, we work with our clients to implement change based on the principles of a holistic problem-solving framework — Design Thinking.

What is Design Thinking?

Design Thinking is a creative but practical method for problem-solving that has evolved from fields as varied as engineering, architecture, and business. It helps companies understand the hidden loopholes, not to mention the potholes they have to confront when finding the best answer to a problem. Design Thinking can also measure a project’s success or lack thereof. Within the Design Thinking framework, Robosoft and our clients can challenge the scope of our thought processes and ability to push their boundaries. That’s why Design Thinking is the foundation of our Digital Transformation strategies.

Three significant elements of Design Thinking: Empathy, Iterativeness, and Collaboration.

Although there are several renditions of Design Thinking, we’ve found that Empathy, Iterativeness, and Collaboration seem common to all. Many companies, realizing how important design advances are to profitability, are beginning to invest in Design Thinking initiatives. So, we are now offering our clients a cutting-edge innovation focused on creating new digital products. It’s called RAPID – an acronym for Robosoft Accelerator for Product Innovation in Digital.

Here’s How an Accelerator for Digital Product Innovation Helps Business

Virtually every product category is witnessing a constant and continuous need to keep up with business, technology, and user trends. If that weren’t challenging enough, new features and products could be copied or improved upon by the competition. So, speed is of the essence, along with user-centricity. And the Robosoft Accelerator for Product Innovation in Digital (RAPID) fills this need.

RAPID can accelerate innovation in all three stages of a product’s life cycle: Ideation, Development, and Continuous Improvement.

How RAPID Works in Just Eight Weeks

1. Commencement Phase-

In the Commencement Phase, we lay down the groundwork for the project. This covers initial planning and a discovery process with select business stakeholders that includes:

agreeing on the product’s intent and vision.
conducting empathy-based user research
defining key challenges and pain points
conducting a competitive analysis and benchmarking

2. Co-creation Phase-

In the Co-creation Phase, the longest part of the process, immersive workshops are held for key business stakeholders, and team members agree to follow a common goal. Together, the team validates requirement features and scope.

3. Consolidation Phase-

In the Consolidation Phase, the team considers UX/UI Design Prototypes. Bringing all of the project’s elements together, they refine them and create a final proposal for the project’s design and development.

Five More Reasons RAPID Makes Business Sense

It Reduces Risk: Through iterative testing and prototyping, RAPID helps to reduce the risk of investing resources in products or services that may not meet customer needs.
It Increases Efficiency: Using an iterative Design Thinking process; organizations can identify and address potential issues early on, reducing the need for costly revisions later.
It Ensures Stakeholder Engagement and Buy-in: By involving stakeholders in the Design Thinking process, companies can better see the complete product development process. It helps all stakeholders to stay on the same page.
It Enhances Customer Satisfaction: Design Thinking puts the customer at the center of the process, ensuring their needs and preferences are understood and met. This leads to more satisfied customers and higher customer loyalty.
It offers a Competitive Advantage: Creative problem-solving helps organizations identify new and innovative solutions. When combined with an understanding of user expectations, creative problem-solving provides a competitive advantage to companies by delivering more relevant and compelling products and services.

Strategizing with Design Thinking Greatly Improves Corporate Performance

According to Fortune, businesses incorporating Design Thinking into their corporate strategy may outperform industry rivals by as much as 228%. But to continue this success, cognitive science and user experience expert Don Norman suggests that companies must evolve away from designs that center only on single users to those that focus on solving the community’s needs. Ultimately, this human-centered design will lead to corporate goals that solve global problems while satisfying individuals. And, in this fast-paced digital world, RAPID can lead the way in creating more satisfied customers and profitable companies.

UX/UI Design

How To Sell In The Digital Era (Hint: It’s Not About Technology But Human Emotions)

Jul 19,2022 / By Ravi Teja Bommireddipalli / No Comments

Contrary to popular belief, humans aren’t inherently rational when making decisions. Our buying decisions stem from the subconscious mind 95% of the time. The rational mind is good at justifying what the emotional mind has already decided.

A good brand understands this well and builds digital products and experiences that tap into the emotional and irrational side of the users’ brains. They apply design principles and theories of psychology to understand what resonates with users and create digital platforms and apps around it.

To build a successful digital product, you can start by understanding and applying the following design theories and frameworks.

1. RWW Framework: The real-win-worth it (RWW) framework is a go/no-go screening method that helps you eliminate bias from the decision-making process and maintain objectivity. Ask yourself questions such as:

Is it real? Is there a market opportunity for my product? Is it feasible to build it?
Will it win? Is there an opportunity for the product in the market? Can it help my brand gain and sustain a competitive advantage?
Is it worth the effort? Is the idea worth implementing? Will it help me achieve my business goals or open doors for future opportunities?

2. Tim Brown’s Design Thinking: Tim Brown defines design thinking as a set of cognitive, strategic and practical processes that help you develop design concepts. The five components include:

Empathizing with the users and understanding their challenges.
Defining the core issue that they face while using your product.
Ideating potential solutions to solve the problem.
Building a prototype of the solution to check if it can address the user’s problem and work on the product if it’s successful.
Evaluate the outcome of the solution by defining the metrics and measuring them regularly.

3. Don Norman’s Three Levels Of Design Appeal: Great products always make users feel things. They trigger an emotional response and spur behavioral changes based on those responses. Don Norman calls it the three levels of design appeal in his book Emotional Design. The three levels are:

Visceral: Evoke the proverbial love at first sight response within your users by targeting their old brains with your product design.
Behavioral: Build an immersive experience that helps users feel empowered and derive value. They should feel happy or productive after using the product.
Reflective: Target the logical side of the human brain by making the users feel proud of using the product and enabling them to share their experiences with others.

You can implement these principles by:

#1. Demonstrating trustworthiness. Most users (66%) revealed that they would purchase a product because of positive reviews. Request users to rate and review your products and publish them on all channels. Offer them freebies or discounts for their unbiased reviews. Use pictures of real people endorsing the product to build trust. An A/B testing experiment by a web company revealed that using real, happy people’s pictures on a landing page increased sign-ups by 102.5%.

#2. Facilitating snap decision-making. Facilitate quick decision-making on your digital platform or app. One in five users abandons their purchases due to an inconvenient checkout process. But one-click checkout options, for instance, can allow users to save their address and payment methods as a default option to accelerate the checkout process. Find out what stops your users from completing the desired action and eliminate those deterrents to create a seamless experience.

#3. Addressing by name. The bystander effect theory states that if one person sees someone in distress, they are likely to help them 70% of the time. If multiple people see distress, that number would be around 40%. Eliminate the bystander effect by addressing the user by name. This will elicit their response faster. You can do it through personalization. Research shows that 60% of people want personalized offers in real time.

#4. Using the power of commitment. Social validation compels users to complete a task. Allow users to make their private commitment public. If the user is participating in a 30-day fitness challenge, for example, give them an option to share their progress or completion badge on social media platforms. The response from friends and followers will boost engagement.

#5. Talking to the reptilian brain. Humans have three regions in the brain: the reptilian brain, the emotional brain and the rational brain. The reptilian brain works on instincts and controls the behavior for survival. Talk directly to the reptilian brain to improve conversions. Tap into emotions such as fear and greed through images and text. Center the experience around the user, such as their challenges and victories, through stories and powerful words like trust, safety and love that imply an emotional connection.

#6. Performing usability testing. Always perform usability testing to understand the interaction between your users and the product. Empathize with their challenges to build a better human-centric product. You can conduct various usability tests, such as the thinking aloud test, in which you ask the participants to express what they feel about the product as they use it to get firsthand, undiluted responses. You can also use eye-tracking technology to track participants’ eye movements. This allows you to record areas where the eye movement stops or moves faster. Observe and collect empirical data such as how long it takes for users to complete the desired action to identify the possible bottlenecks and fix them.

Ad guru Bill Bernbach said, “Advertising is fundamentally persuasion, and persuasion happens to be not a science, but an art.” His words still hold true in today’s digital era. New technologies and platforms have come, and the metrics to measure effectiveness have changed. But selling is still about how we persuade and sell to humans centered around users’ experiences.

As Don Norman and Jakob Nielsen of the Nielsen Norman Group put it, “True user experience goes far beyond giving users what they say they want or providing checklist features.” So, understanding human psychology and appealing to their emotions is key even in the digital era.

This article was originally published in Forbes Technology Council.

Customer Experience UX/UI Design

A Data-Informed, Design Thinking Approach For User Retention

Apr 25,2022 / By Ravi Teja Bommireddipalli / No Comments

Consumers have an abundance of choices today, so brands might rightfully rejoice when acquiring users. However, user acquisition does not guarantee user engagement, and this oversight can have a spiraling impact on retention. All businesses, even the neighborhood retail stores, know that acquiring a customer is more expensive than retaining current customers.

In businesses where digital experience is the brand experience, user retention is even more challenging, as an average consumer has a multitude of apps for different purposes. Disengaged users are a red flag for mobile-led businesses, signifying potential revenue loss.

Existing users are an asset waiting to be tapped, with a direct way to reach them already in place. User retention cannot be an afterthought; it needs to be planned for even before a single line of code is written. How do we then go about retaining, activating and engaging current users?

Digital products that are most successful demonstrate good behavioral design by engaging users regularly, making them believe they can’t live without those apps. In building our user retention strategy, we can no longer overlook the human-centric design approach.

Donald A. Norman, in his book Living with Complexity, writes:

We can create positive customer experiences by placing users at the center and making sure that all the touchpoints address their needs—or, better still, predict their future needs seamlessly, which is the fundamental premise of design thinking. Involving the end user at every iteration (ideation, innovation, co-creation of solutions, continuous improvement) opens up avenues to discover ways of improving user experiences—and, thereby, retention and business growth.

Key Elements Of Design That Help Retain Users

Successful design attracts users through an emotional trigger, incentive or motivator that encourages a positive action or investment leading to a reward. With each use, they see themselves earning brownie points or feel valued even if the reward is not monetized. Users return to the app because they want a repeat experience.

Another element is the intuitiveness of the design—convenience of use, flexible features, consistent performance. Particularly when an app is enriched with complex features, simplifying the interface and making it intuitive (both UX and visual elements) can ensure that any time spent on learning the app seems worthwhile for the user.

However, this does not mean the design is perfect right away. The very essence of design thinking is that there is always room for improvement and the app keeps evolving so users remain interested and engaged. The loyalty of Apple phone users is based on the promise that with every iteration, the product is only getting better. Therefore, it’s important for design not to stagnate but to be iterative, innovative and tested to be able to meet their changing demands.

Tuning in to the demands, needs and unique context of the user tops the list in design thinking, and it begins from the moment the person downloads the app and starts a relationship with the brand. Behemoths like Apple and Disney, as well as digital native startups, have opened up our world to design thinking as a user-centric practice. Brands like Ikea continue to attract and engage users because of the do-it-yourself factor that instills a sense of ownership and pride in the product that the buyer has “put together” on their own.

Design Thinking Elevates User Experience

Today, brands and businesses also have the power of big data and artificial intelligence to guide the narrative around key business decisions and customer engagement.

While data and design have delivered immense value as separate disciplines, there is great merit in understanding what they could offer in combination for user retention. A McKinsey study of the design practices of 300 companies found that “the top financial performers had integrated design across the organization rather than creating design units within specific departments.” McKinsey also estimated that “60% of companies successfully scaling analytics to solve problems across the organization used cross-functional teams.” That means data scientists and researchers are sharing insights and coffee with visual designers and graphic experts on how to arrive at the best or most viable solutions to address specific user needs.

Based on what data analytics tells them, design thinking can help at key phases of the brand-user relationship: onboarding, nurturing and attrition.

Onboarding is the most important and needs to be friction-free. First impressions last, and they need to be immersive experiences that immediately introduce the user to the app’s unique features. A common feature of apps with “user love” is that they provide an instant connection to users with a simple user interface, making it easy for them to start using the app without a fuss. The simplicity of design encourages them to come back and explore unique features that they could potentially leverage repeatedly.

Nurturing user habits is a must, as merely hooking them initially doesn’t guarantee continued interest. Their engagement can be sustained by encouraging them to cultivate habits that are supported by the app and infusing a greater sense of personalization in the user. Push notifications and personalized recommendations based on predictive analyses of the user’s personal data, behavioral patterns and preferences need to be baked into the digital strategy.

The “listening to the user” aspect of design thinking in combination with data plays a vital role in the attrition phase. It allows the app to evolve along with the user’s changing needs, feedback and reviews. Telling users that their inputs are valued and acted upon in the form of new features and upgrades can enhance their sense of loyalty and likelihood of returning to use the app.

In The Design of Everyday Things, Norman says: “Cognition attempts to make sense of the world: emotion assigns value.” As research suggests, a marriage of the two could well take user engagement and business growth to unimagined heights.

This article was originally published on Forbes Technology Council.

Design UX/UI Design

Accessibility in design: best practices for creating human-centric and inclusive digital experiences

Dec 30,2020 / By Priyanka Shroff / No Comments

The concept of Accessibility in design was introduced to enable people with special abilities to perceive, understand, navigate and interact with digital products and platforms with ease. Over time, this concept has expanded to help enterprises create digital experiences for a large group of users, regardless of their current circumstances. After all, a design is only useful if it is inclusive – i.e., accessible to a wide group of users.

COVID-19 has accelerated the adoption of digital mediums even for day-to-day tasks and communication. With people avoiding physical contact, some designs that were earlier created for lowering the usage barriers are now proving to be extremely useful. The automatic sliding door in shopping complexes and supermarkets, which was created to make entry and exit easier for people, has now become critical when people do not want to touch physical surfaces.

Enterprises are also improving their digital experiences to meet the demands of consumers in the new normal. A few airports have offered self-check-in kiosks and automated boarding by facial recognition for some time now. Technology is increasingly playing a greater role. United Airlines has recently upgraded its app with a slew of features such as check-in, printing of bag tags, and downloading boarding passes. Additionally, they have also ensured that the latest updates make the app more accessible to people with visual disabilities. To do so, they have increased color contrast, added more space between graphics, and reordered how information is displayed and announced. This way, screen readers will be able to convert text to audio in a more seamless, logical sequence.

Designing for Accessibility – the need and how it can lead to better designed digital experiences

Accessibility and simplicity in design go hand-in-hand and solve usability issues. Taking Accessibility into consideration introduces a set of constraints for designers and inspires innovations that can result in better designed and easy-to-use products for all users.

“It’s really common to end up just designing for yourself. So if you can push yourself to think, How would a different group use this?’ or even How would your kid or grandmother use this? it can lead to a better, more accessible design.” – McKinsey Design Senior Design Researcher Madison Berger.

In this article, we will explore the concept of Accessibility and the best practices to design digital experiences that are accessible to a diverse set of users. We will also briefly introduce the concept of Inclusion and how it differs from Accessibility. Additionally, we will see some interesting use cases and examples keeping in mind the design thinking approach.

Accessible and Inclusive designs – two pillars for creating human-centered digital experiences

Creating Inclusive designs involves an understanding of user-diversity. It is a methodology that is human-centered and means including a varied set of users, with a wide range of perspectives. As per Web Accessibility Initiative, “Inclusion is about diversity, and ensuring involvement of everyone to the greatest extent possible.’’

Accessibility is an outcome of Inclusive Design

Accessibility is an attribute of Inclusive design. Accessibility advocates often describe the concept as providing access to products and services for people with recognized disabilities. However, Inclusive design is much more than creating digital products that can be used by people with different abilities.

Accessibility: the qualities that make an experience open to all.

Inclusive design: a design methodology that derives design inspiration from a full range of human diversity.

While Accessibility focuses on sections of the population with a defined disability, it is possible that some sections of users may be left out in the process, like users with language barriers. Inclusive designs take into account such constraints that users might have. For example, the Zangi messaging app allows for left-hand orientation to ensure their app is easy to use for people who read and write from right to left.

Another such example is the Apple Watch which gives left-handed users an option to choose the wrist they will wear the watch to check if the crown should be facing to the left or right. The screen then orients accordingly and all users have to do is swap the two halves to the band so they can buckle it correctly.

While creating Inclusive designs, designers actively seek out diverse situations and aim to address them. Therefore, we can say that Accessibility and Inclusion work hand in hand to create products and solutions that are usable and accessible by everyone.

“Accessibility is an outcome. Inclusive design is a process to create a masterpiece.” – Derek Featherstone, CXO of Level Access.

How to design digital products for Accessibility

The Web Accessibility Initiative’s definition of Accessibility talks about addressing the issues of user experience for people with special abilities. When creating a new product, companies often identify and design for their target markets. However, human-centered design can help businesses consider a much diverse and larger group of users, and thus a larger target market.

“The longer an organization waits to incorporate accessibility, the greater the chance that the product will be inaccessible (or expensive and time-consuming to retrofit). When the product team considers accessibility from the start, they can iterate, test, learn, and end up with a stronger product.”, stated a recent 2020 Digital Accessibility Report by Level Access.

Role of Design Thinking and User Empathy while designing for accessibility

Empathy is one of the core attributes for creating human-centric digital experiences. In her book, Accessibility For Everyone, Laura Kalbag, writes that in order to improve the user experience, designers must focus on the concept of usability from four broad parameters:

Visual: make it easy to see
Auditory: make it easy to hear
Motor: make it easy to interact with
Cognitive: make it easy to understand

While designing for Accessibility, it is important to know user behavior from all the above perspectives. Creating Empathy Maps, which is a critical step of the Design Thinking process, can be a useful tool to achieve this. For teams involved in the design and engineering of products, services or experiences, an empathy mapping session is a great exercise for groups to “get inside the heads” of users.

Learning about the target group at an empathetic level opens up the opportunity to understand their intent while using a digital product and how they are feeling while trying to accomplish it. This allows product and design teams to get empathetic insights which can help them build a product, service, or experience that enables accessibility as well as inclusiveness.

“The aim of empathic design studies is not to seek solutions for recognized problems, but rather to look for design opportunities as well as develop a holistic understanding of the users. Design empathy is not only information and facts, but also inspiration and food for ideas.” — Tuuli Mattelmäki, Finnish industrial designer, researcher & lecturer.

Designing for Accessibility: best practices

Below are some of the key factors that can be considered while designing for Accessibility. These factors bucketed as per the following attributes:

Usability and heuristics
Design and interaction
Content and Communication

Usability and heuristics

Navigation bar on your website: A simple and straight-forward navigation bar can make it easier for a visitor to navigate through a website. For visually impaired users, it is important to include a voice feature to simplify the navigation process.

The latest Apple devices have VoiceOver – an assistive screen reader that allows impaired or disabled users to easily navigate their devices.

A look at Facebook’s Accessibility menu that slides in from the top of the page

Usability and readability of links: Most browsers render links in blue text with an underline by default. The contrast between link text and regular text is the key factor for spotting the hyperlinked words or sentences. Most people with color blindness cannot distinguish between colors but can see the underlined text. For improving Accessibility, adding an underline for the hyperlinked text is critical, like done on the GDS website within the body of the articles.

Image source

Similarly, adding a dark mode feature can also help in improving readability.

Design and interaction

The WCAG documents explain how to make web content more accessible to people with disabilities. Some of these guidelines include considerations like:

Provide sufficient contrast between foreground and background
Avoid using colors alone to convey information
Ensure that interactive elements are easy to identify, and more

Color contrast between foreground and background: This dashboard of the Invision app, which shows the status of invoices, indicates which ones have been successfully issued, and also displays any cancellations or errors, using color contrasts. The dashboard also features readable typography with large font sizes and high-contrast colors. The icons help to distinguish content for users with cognitive issues.

Image source

Control over contrast ratio on Skype

Ensure that all images are marked with alternative text: Adding ALT text to your HTML code allows visually impaired people using screen readers to understand what the images represent.

Here is the ALT text displayed in the code editor:

Image source

Carousels and animation elements: When using carousels and animation across your web platform, it is imperative to let users take control over the next slide advances. For instance, the below slider template highlights highly visual content, features dot navigation, and is touch-friendly on mobile devices.

Image source

Choice of colors in design: Colors play an important role in impacting the design accessibility of a digital product. The popular game Among Us relies on color encoding as a primary identifier for players. The game revolves around identifying an ‘imposter’ in the group. Colors remain the primary identifier for players for this purpose, as players commonly use names such as ‘I’, ‘No one’, ‘Someone’ or simply colors to name themselves, like a player with a green avatar sets their name as ‘Red’. However, the process as shown in this video becomes extremely chaotic when players just use their pronouns as their avatar names. In such a scenario, any form of color blindness can impact players’ performance during the game. This case study showcases how the game could be recreated using various color schemes to include people with color blindness. The solution could be as simple as using additional identifiers for players, like ColorADD color identification system which uses symbols to represent different colors or displaying the name of the color right next to the avatar name.

Displaying the name of the avatar’s color in brackets similar to how the name of the player is displayed

Image source

For designers, there are multiple resources that one can make use of for creating a color scheme that is more accessible. Some such tools include Adobe Illustrator’s Color-Blind Proof Setup and sites like ColorBrewer that can help them select a colorblind-friendly color scheme.

Content & Communication

Font size: With mobile devices, readers often use the pinch gesture to zoom into text, making it bigger and easier to read on smaller screens. However, developers often disable zoom to gain greater control over the page layout resulting in an irritatingly common accessibility problem. As a best practice, the recommended font size should be equivalent to 16 pixels or larger, depending on the font type. Certain apps also allow users to change the font size basis their preference. One such example is the Kindle app across devices that allows to customize font size basis reader’s preference.

Font customization on the Kindle App

Telegram allows to change text size for better readability

Font customization on Axis EasyConnect App

Using forms and other data capturing methods: Forms are enabled on a website for a user to communicate with a site. But even filling out the shortest form can be taxing for people at times. A common error that people tend to make while filling forms can be in the date formats.

Formatting the content of an input field should not be a burden for the user. To make such tasks easy for the user, designers and developers should ensure that the user’s input is converted into the necessary format by default.

In conclusion:

Designing user experiences often involves making assumptions about users’ preferences. While we should question those assumptions and use research to better inform ourselves about user preferences, sometimes just providing, an alternative way, can make a huge difference.

In this ongoing process, the importance of usability, accessibility, and inclusion cannot be understated – especially now, when there is so much reliance on the digital medium to complete daily activities. The process of designing for accessibility should be included in the initial stages itself and shouldn’t be an afterthought. Shifting accessibility testing in the development stage to gather real-time feedback from people and carrying out design research will help to achieve this goal.

Accessibility and Inclusivity are two pillars of creating human-centered design for a wide range of users. Microsoft’s Inclusive Design Principles define Inclusive Design as – a methodology, born out of digital environments, that enables and draws on the full range of human diversity. Most importantly, this means including and learning from people with a range of perspectives.

Diversity is Being invited to the party; Inclusion is being asked to dance — Vernã Myers

In an upcoming post, we will cover Inclusive design in-depth and with some interesting examples.

While creating digital experiences from an Inclusive design perspective the saying ‘the more the merrier’ fits just right. The larger and diverse the group of users considered while designing, the better it is for both – users and enterprises.

Customer Experience Digital Transformation Fintech Media, News & Entertainment UX/UI Design

Multiexperience: the imperative for every CXO for 2021 and beyond

Dec 15,2020 / By Ravi Teja Bommireddipalli / No Comments

‘People buy from those who they trust’ is an adage that is timeless both in the offline and online world. Whether it is the familiar neighborhood store or an enterprise in the online world, earning consumer trust has always provided an edge – helping in customer retention and loyalty.

The trust factor came into play even more so in 2020 which has been tumultuous, to say the least. The global COVID-19 pandemic has disrupted the lives of people and enterprises alike in a manner we never imagined or prepared for. While several industries have been adversely affected (e.g. restaurants, amusement parks, cinema halls) many others have benefited. Digital banking, fintech services, streaming video services, EdTech, online delivery are some of the categories which have seen usage surge in 2020. The one factor which binds all the brands we turned to during this time has been the trust and familiarity factor.

As mentioned by McKinsey, particularly in times of crisis, a customer’s interaction with a company can trigger an immediate and lingering effect on his or her sense of trust and loyalty. They go on to say:

‘Now is also the time for customer experience (CX) leaders to position themselves at the forefront of the longer-term shifts in consumer behavior that result from this crisis. Keeping a real-time pulse on changing customer preferences and rapidly innovating to redesign journeys that matter to a very different context will be key.’

Years ago, the proliferation of digital platforms, channels, and devices led to the concept of multi-channel experience – which essentially meant presence across multiple channels. It was essentially a checklist approach of presence across digital platforms.

It later progressed to omnichannel – when such brand experiences were ‘connected’ across channels. Banks and retail enterprises were among those leading the call for such omnichannel experiences as can be seen by their efforts to have a presence through a physical store or branch, a website, and a mobile app. Starbucks and Disney are among the many brands which aced the omnichannel strategy.

Beyond omnichannel – the multiexperience advantage

As devices, platforms, and technologies proliferated over the years, consumer habits, dependencies, and expectations changed too. In order to address these changes effectively, Gartner proposed a change in mindset, espousing multiexperience as a new approach.

It calls for a customer journey-centric approach providing multisensory, multimodal, and seamless experiences. It calls for crafting seamless and native experiences across an increasing number of touchpoints – whichever mode the customer is comfortable with. It could be voice, chatbots, personal assistants, wearables, and augmented or virtual reality. In simple terms, multiexperience is taking the brands or products where the customers are and allowing them to engage as part of their user journeys.

The key is to get all this done without friction and using that platform, touchpoint, or interactions feature to the maximum benefit. At a glance, the difference between multichannel, omnichannel, and multiexperience would look like this:

The critical difference is the consistency of the digital experience and the seamless handover from one device to another mode, without the hassle of starting off all over again. Dennis Maloney, Chief Digital Officer at Domino’s Pizza said:

“What’s the easiest way to order? When you don’t have to do anything.”.

Domino’s Pizza’s ‘Anyware’ platform allows users to order in 11 different ways – from voice assistants to smart TV. The focus is on letting the consumer do less to place an order and from as many devices and modes as possible.

Image source

Another example of such a seamless experience is being planned on Google Maps which was hitherto only seen as a navigation aid. Today, it is being re-imagined as a means to gather information such as cab fares, show real-time ‘crowdedness’ information, and live food delivery status.

Multiexperience also requires backend applications to be micro-services enabled so that re-usable components are created to make them digital-ready. The microservices architecture is based on a collection of interconnected services. They are easier to build and maintain, and focus on business capabilities while enhancing productivity, speed, and scalability.

Why multiexperience? Winning the two big wars.

‘Change is the only constant’ maybe a cliche but never has the pace of change been so accelerated as in the digital age. Who would have thought that several industries would be upended when technology and great customer experience come together? Fintech, utility services, food delivery, aggregators across taxi services, and more have benefitted from fulfilling customer needs through great digital experiences.

These developments have forced legacy brands across segments to re-look at their business model and customer experience. Product or service parity is common across categories leaving little or no room for real, meaningful product differences. The only edge very often is customer experience. And as we live in an experience economy, this becomes core to a business strategy and not just limited to optimizing technologies or user experience.

At Robosoft, we recently crafted a multiexperience OTT platform for Discovery+. Viewers are evolving and methods of consuming content are fast changing. Brands today are constantly battling for user attention and time. This combined shift in the OTT space led us to the creation of a unified and effortless experience for Discovery Plus. With users owning more than one device, the goal was to design and deliver a consistent experience across devices, regardless of where the user starts, continues, and ends the journey.

The other big war afoot is the one to win consumer’s trust. In the digital world, it is said that winning consumer’s attention is important. But I would argue that beyond mere attention, enterprises should strive to win consumer trust – as that is what leads to retention and consumer loyalty. Design can play a role in retaining customers, especially in businesses where subscription and repeat purchases are critical.

In the post COVID world, it is imperative that CXOs embrace the multiexperience mindset and craft effortless and seamless experiences that enable customer delight and win their trust.

This article was originally published at Linkedin Pulse under my LinkedIn handle – Ravi Teja Bommireddipalli

Customer Experience Digital Transformation Media, News & Entertainment UX/UI Design

Key factors to consider while designing an OTT platform in 2021

Dec 8,2020 / By Noelle Mathew / No Comments

The script of the media and entertainment sector is getting re-written, as the content consumption patterns of consumers see a tectonic shift in a post COVID world. While the gradual move of consumers towards OTT mediums was already underway, the lockdowns, need for social distancing, dearth of other entertainment avenues accelerated this momentum.

The average time spent on subscription OTT and Video-on-Demand content in the US alone has risen by 23% from last year.

As viewership skews towards OTT, more and more media and entertainment players are launching their OTT platforms. According to a recent Research Dive report, many digital media and broadcast providers have stepped up their efforts to build new channels for consumers to access different types of content. We recently partnered with the leading infotainment brand Discovery, to launch their OTT platform Discovery+ for the Indian market. The app received close to 3 million downloads within just 4 months of its launch.

With existing OTT players stepping-up their game with richer content, personalized experience, and more, the new entrants have stiff competition ahead. In this article, we will outline the factors that will help enterprises build a successful OTT platform.

Key factors to consider while creating a successful OTT platform

The journey of any digital product development starts from understanding the users’ needs and pain points, ideating on a solution that will address these needs, and finally developing a user and business-centric product.

In this article, we will outline the journey of creating an OTT platform in two phases: (a) Research & prototyping and (b) Execution & implementation.

Getting started – Competitor Research, User Research & Prototyping

At Robosoft, we use the principles of Design Thinking to create user-centric experiences – which start from empathizing with and understanding the users. In that context, user research and competition research become critical aspects to understand the business and customer requirements.

1. Competitor research

With the deluge of OTT platforms, it becomes important to understand the competitive landscape. This will not only help in outlining features that already exist and work but will also help in avoiding the shortfalls of other platforms. Knowing the competition is also critical to offer something better and unique and gain a competitive advantage.

For instance: in OTT platforms – ‘Add to Watchlist’ or ‘Like’ is a common feature. However, just trying to replicate the same model is insufficient. In order to create the differentiator, we need to delve deeper into the world of ‘favoriting’ and what makes the user want to add a particular content to a list

In this instance, some of the key aspects we need to understand about what is already being offered can be:

The value of a watchlist and how it works
UX flows – how to keep the viewer moving forward while making it quick and easy
How to help viewers feel smart and put their mind at ease
How to improve the disadvantages & limitations.

An understanding of such factors will help in creating a differentiation in UX, even while offering the same features.

We kept such in mind when we built the Discovery+ app, ‘Continue Watching, Favorites & Watch Later’ features were added. Once the user likes or favorites something, they get a notification for similar content or new episodes and populates the home screen basis the user’s likes/favorites.

2. User research & prototyping

To design user-centric experiences, understanding users is critical. One of the most important stages of user research is creating Empathy Maps that enables design and development teams to chart out users’ motivation and pain points. In the context of OTT platforms, user research can help to derive the below expectations of users:

Expectations from an OTT platform: as a user

see value in what is offered before making a decision.
keep moving forward while watching content; it can be shifting from one episode to another or an alternate movie or series after a season.
seamlessly navigate through the platform or complete their journeys (e.g. from logging in to paying).
feel self-reliant or empowered and have their minds at ease while using the platform.

Prototyping

Once both competitive and user research is done, the findings can help in creating a high, medium, or low fidelity prototype of the proposed solution. Prototyping is the stage where a representative model is built to validate its viability and experience. It can help in testing various features and get quick feedback from users and iterating the solution accordingly. Keeping the final outcome in mind is the most important aspect of this stage.

For example: while testing a new live racing experience for GCN’s (Global Cycling Network) VoD app, our team had the below goals in mind and created flows to evaluate them accordingly:

Goals for user research

Identify any aspects that might cause the user to abandon the viewing experience.
Understand which aspects provide value and which do not.
Gauge how the sports enthusiasts feel about such a feature.
Explore how easy it is to navigate across the journey.
Understand the sports enthusiasts mindset and expectations to subscribe for such a feature.

The feedback ranged from excitement for the feature to quick suggestions on how we can improve the prototype. This helped us to build faster and build something that the cyclists and cycling enthusiasts will expect from the platform.

Execution and implementation

1. UX of content

With the proliferation of content on the OTT platforms, the challenge for OTT players is to ensure an easy experience. The faster and easily users can get to the content they like, the more likely they are to stay on. Some of the factors that help in this are:

A clear segregation of the content types: since content is key on OTT platforms, the experience to discover and view the content has to be delightful and seamless. Clear segregation of content types helps in this aspect.
Different treatment of content categories: live content and VoD content (VOD – Shows, Movies, or clips).

Easing the content discovery journey by defining clear navigation to browse content and finding what to watch and creating clear sections for premium, short-form content.
Clear categorization by language, type of content (Movies, TV Shows, genres, audience segments).

2. Design System

As designs evolve, OTT players will need to think about building thoughtful design systems. A well-defined design system can help create well-designed user-centric digital products. While colors and typography play an important role, how the interfaces are built help to tell the whole story. This is where the Atomic Design system comes into play.

In an Atomic Design, interfaces are made up of smaller components. This means the entire interface can be broken down into fundamental building blocks and built up from there.

For example: for Discovery+, we created the design from scratch using the Atomic Design system to build a unified and consistent design that is scalable.

3. Personalized User Experience

In the digital era, users expect a personalized experience from all their digital interactions. Here are a few ways in which OTT players get their personalization game right:

AI-powered recommendation engine

Building a robust recommendation engine is the key aspect of creating a personalized user experience. More than 80 percent of the TV shows people watch on Netflix are discovered through the platform’s recommendation system. Netflix uses machine learning and algorithms to help go beyond viewers’ preconceived notions and find shows that might not have been their first choice, but they will like. The data that Netflix feeds into its algorithms can be broken down into two types – implicit and explicit.

Examples of ‘explicit data’ will be giving a thumbs up for a show. ‘Implicit data’ is behavioral data; for instance, if a viewer binged on a show and completed watching it in two nights, the engine understands that behaviourally. The majority of useful data is implicit.

Image source

Personalized upsell and retention packages

Today’s subscribers want services that are personalized at every stage of the experience from sign-up to discovery, viewing, and renewals. Thus, personalization should permeate beyond content and include the entire user journey on the app. Today a user is constantly toggling between multiple devices while accessing the platform. Developers will need to take into account data from these sources to notify the user about the upsell and the renewal offers. That also includes giving the user the power to make choices.

Device management is another aspect of creating a personalized experience. Allowing users to choose multiple devices, streaming quality options, renewal options tailored to their choices, etc. can help in elevating user experience and ensure retention.

Image source

4. Elevating user experience through easy navigation

Even if an OTT platform has an awesome content library, if users find it difficult to navigate through it they will abandon the app. According to a research, 80% percent of users uninstall an app due to a bad user experience. Here are a few factors that lead to a great user experience:

Easy onboarding and simplifying the journey

It is critical to make the onboarding process quick and easy. In that context, app owners should only ask for essential personal details and permissions and stick to the key features and UI elements that are absolutely necessary.

Tech-savvy users might not want to be hand-held through the onboarding process. In that context, giving users the option to skip becomes a critical aspect. In fact, music video streaming app Vevo found that adding a skip option to their onboarding flow increased logins by nearly 10%.

Preview app content

Another way to speed up the process and make the onboarding process quick and interesting is to allow users to experience the app before asking them to sign up or taking them on a product tour. Hotstar previews popular content and lists membership benefits on the very first screen — and they feature a prominent free trial button. Going one step ahead – Netflix now lets users turn off autoplay previews. That means videos and movies won’t begin to play trailers or video clips as they are looking for something to watch. Users can turn it off on every device at once.

Image source

5. Intuitive UI and simplified viewing experience

Intuitive UI simplifies every aspect of the process. In the case of OTT platforms, it is important to not just simplify the process of discovering content but also watching. Some key features to get that right are:

Giving the flexibility to switch on-and-off the subtitles option.
Information about the quality of video and data consumption.
Option to resume from where the user left off.
Quick and easy buttons for start, stop, rewind, fast forward.

Image source

6. Building a multi-experience for users

Today viewers are consuming content on multiple devices. Seamless delivery of content on multiple devices is no longer an option for OTT players, it is mandatory.

While building the Discovery+ platform, the goal was to design and deliver a consistent experience across devices, regardless of where the user starts, continues, and ends the journey.

Casting to a larger screen is another opportunity that can enhance user experience and help in driving the value for viewers. The Discovery+ app has the casting feature which is an easy way of connecting web, tablet, and mobile to a TV. The feature allows users to enjoy a big-screen experience with family and friends.

Another important aspect of adding value to users’ on-the-go viewing experience is by giving control of watching content at their convenience without the limitation of internet speed. In that case, the option for downloading the video for watching later enables the user to engage with the app and the content they like whenever they want.

Image source

7. Subscription models

A subscription model provides predictable and recurring revenue for a long-term engaged user base. Subscription strategies allow OTT platforms for price diversification, accommodating a broader, diversified income group of users over a fixed ‘one-price-for-all’ model. However, it is critical to choose a subscription model that fits the requirements of the viewers. For instance, most broadcast players getting into OTT have a yearly and monthly plan with free trials or free access to regular content. On the other hand, established players like Netflix will have subscription models that are only yearly or monthly.

On Discovery+ the subscription model that was built-in was ‘free unlimited access to regular content’. However, to view premium content, an additional fee is charged. On Global Cycling Network, users can buy a monthly or yearly race pass to get unlimited access to the best cycling content.

8. Easy Payment gateway integration

With a plethora of payment options available, making this step easy is important. Major OTT apps accept payments through credit or debit cards, digital wallets, and real-time payment systems where available. Further, these platforms bill users every month on the same day making the payment cycle easy.

9. Push notifications

Push notifications are an essential part of the user experience and can ensure continuous engagement with viewers. However, badly done push notifications can also lead to users abandoning the app. According to a survey, 71% of all app uninstalls are triggered by a push notification. Here are a few factors to get push notifications right:

Make personalized and relevant to the user.
Sending notifications in the engagement windows and at the local time zone of the user.
Send actionable notifications to drive engagement.
Don’t send too many notifications in a short duration.

Image source

In conclusion:

As OTT becomes increasingly popular, more and more entertainment and media firms will develop their own OTT platforms to engage with the viewers. While the variety and quality of the content will be important to acquire new viewers, UI/UX will play a decisive role in retaining them. In the future with newer technologies, we will see interesting innovations in the OTT sector, but a simple and delightful user experience will remain the most important factor that will define the success of any OTT platform.

Digital Transformation UX/UI Design

PR FAQs – Product team’s guide for creating digital products that customers love

Nov 24,2020 / By Maleeha Naipaul / No Comments

Creating a product vision is not just the first step towards embarking on the journey of successful product development, it is the most critical one.

“Be stubborn on vision, but flexible on details” – Jeff Bezos

Enterprises across the globe have various tools and methodologies for arriving at the product vision. PR FAQs (Press Release FAQs) is one such tool. A PR FAQs document is a press release including critical FAQs, that is written for a product that will be released in the future. It is usually written by the product teams for a hypothetical launch of a product, considering that it is already released.

The concept of PR FAQs first introduced by Amazon is now used by product teams across organizations.

What is a PR FAQs and how it helps in creating customer-centric products

At Robosoft, we use Design Thinking principles to understand users’ pain points and needs and then create a product vision that not just solves the real challenges of customers but is in line with our clients’ business goals as well. PR FAQs is a tool that can help product teams present these learnings in a simple format for all the stakeholders across the organization.

Creating PR FAQs is an approach where the product teams work backwards – i.e. they visualize how their end product will look, what consumer challenges it will solve, and how it will solve it? All these are then addressed in the PR FAQs document while keeping customer needs at the center.

The concept of Amazon Go, the chain of automated convenience stores, was a direct result of the “working backwards” approach, which begins with the creation of a PR FAQs document (a press release, frequently-asked questions document, and visual mock-ups). In this case, it all began with identifying the problem: customers hate standing in lines, using the PR FAQs tool.

Image source

Typically, product managers use a product brief to describe their product. This serves as a starting point for the company’s product development and a brief introduction. A PR FAQs document serves as a more futuristic and customer-oriented product brief.

Product teams create a PR FAQs document imagining that the product is already developed and released. They have already envisioned the final product in their minds while writing a PR FAQs document.

Usually, a PR FAQs document will answer the following questions for all stakeholders – design, development, sales & marketing teams, etc.

What does the product do?
What are the most exciting features?
What customer problems are you solving?
What benefits will the users get?

The format for a typical product brief is as follows:

A press release: Written from the point of when the product will be released and how it would be introduced to the public.
FAQ: Potential questions that a given customer would likely ask in order to gain knowledge of the product. The questions are usually framed to seem open-ended.
Internal questions: Questions that are asked by the stakeholders during the product development phase.

Now let us take a look at a PR FAQs template:

Heading: Short, catchy name for the product that a given target audience can relate to.
Subheading: One-liner explaining who the target market is, what the product does, and what it hopes to achieve.
Summary: A brief paragraph, explaining what the product is and its benefits.
Problem Statement: A brief paragraph explaining what precise problem the company is trying to solve with this product and why they are trying to solve this problem. This paragraph may also include pain points on existing products or processes that can be alleviated using the product.
Solution: A brief explanation of how the company hopes to resolve the problem mentioned in the prior paragraph. Usually, it would be helpful to provide research or numbers to back the assumptions made for the resolution.
User Experience: A paragraph explaining how a user would interact with the product itself. In this section one could add an internal quote; something regarding the product for example, why the company feels it’s essential for the given customer base to purchase this product. One could also add hypothetical customer quotes. This kind of information gives more insight into the product or the features.
FAQs: This section would include all plausible questions target customers may want to ask. This includes the typical what, why, when, how, and who questions from the customer’s perspective. This could also serve as a justification for the company to launch the given product.
Internal Section: This part of the document involves questions that the internal teams would ask. These questions could be regarding technical, sales, marketing, or design inquiries. The section would also delve into the solutions for any said questions and would make it transparent for teams to see where this product/feature is heading and what the ask is especially from the stakeholders. It could act as an aid to stakeholders for decision-making purposes. Typically, visuals could be added to avoid having to write out large chunks of words and would help keep it brief.

Some samples of how a hypothetical press release looks like can be found here and here.

Why it is important for product teams to create a PR FAQs document before starting the product design and development journey

A PR FAQs is a commitment to deliver

The PR FAQs is much more than a product brief tool. The press release opens with a location and date of publication; this helps the product team to focus on an idea and commit to meeting their tentative delivery date. Along the way, details and dates might change, but it keeps teams accountable to ultimately deliver on their vision. A PR FAQs is more than a document – it’s a commitment to deliver

Gives perspective to all the product stakeholders

A PR FAQs is written keeping customers at the center and is aimed to give all the stakeholders a brief about the product idea. But, if the PR FAQs document is not clear or exciting enough, the product idea might need to be refined further. A PR FAQs document can help identify shortfalls in the product idea at a very initial stage and can help identify issues like – cramming too many features, or not being able to address the real user pain-points and more. If stakeholders are asking questions that can’t be answered in the FAQs, then the product idea needs to be refined further before starting to build it.

As McAllister, former General Manager at Amazon explains, “Iterating on a press release is a lot less expensive than iterating on the product itself (and quicker!).”

Furthermore, the FAQ component of the document can be extremely effective in capturing the assumptions and perspectives of different stakeholders in a consistent format that everyone involved can understand.

Helps in defining product vision and roadmap

A PR FAQs document can give focus and clarity on the challenges the product will solve for customers. It helps articulate what the client experience needs to be, defines specific requirements that are needed for the final product, highlights the most important features, and hence helps create a product vision and a roadmap.

Motivates the design and development teams to create an exciting product

A PR FAQs document can help product teams test their product idea and gain buy-ins from clients and internal teams on particular features or the product overall. A press release should be engaging and exciting and explaining what your product does. If the press release is not exciting, chances are the product isn’t going to be engaging either.

Getting the stakeholders excited about a “press release” sets the stage for motivated teams when the actual product is built.

How a PR FAQs document can help various stakeholders in the product development journey

A PR FAQ document is useful not just for the product teams but multiple stakeholders in the product design and development journey. Here’s how:

Engineering teams: PR FAQs document can be used to start scoping out the technical aspects of the product. The development team can start by looking at what the product is, how it will help solve any issues, and how much time it will take.

While a product document might be independent of the technical solution, it can help to include some details that will give reviewers an idea of the scale of potential solutions.

The PR FAQs document can be beneficial for the engineering team to immediately start thinking about solutions to the product: what are the code libraries, databases, caching solutions, etc.?

Design teams: the PR FAQs document can help design teams to start thinking about design concepts. It is not necessary to create a text-focused PR FAQs document. Adding a basic wireframe or an MVP concept can help the design teams to further visualize the design elements.

Sales teams: the PR FAQs document can help sales teams to start looking into the marketing of the product, what the market would be, who would buy it, and how profitable it would be for the company.

Marketing teams: the PR FAQs document can help marketing teams craft a key message or benefit that would be attractive to the end customer.

Other Stakeholders: the PR FAQs document can be used to see what resources need to be assigned to this product and how much time it would take to accomplish its implementation.

In Conclusion:

In situations where the product brief or PR FAQs document is cumbersome and difficult, it can be an indication that the product itself might not be worth the effort for implementation. Although, this might not hold true for all products and vary according to the product idea. Each company must find its own way of approaching the implementation of the product and see what works for them.

The most appropriate way to approach the process would be to begin with the basic given format described above and customize the product along the way. This allows for flexibility in the flow of the writing as well as allows room for things such as visuals and graphs that can be beneficial to decision-makers and stakeholders.

Download the above template for creating a PR FAQs document for the next product idea of your enterprise.

Customer Experience UX/UI UX/UI Design

Prototyping for Designers

Sep 21,2020 / By Cyrus A D'silva / No Comments

Good design’s not about what medium you’re working in. It’s about thinking hard about what you want to do and what you have to work with before you start. – Susan Kare

Prototype is the stage where you build a representative model of your solution to validate its viability and experience. It can also help identify what is working and what the weak links are. In this article, we will outline some basics of prototyping, how to create and use them.

What is Prototyping?

Prototyping manages the process of creating solutions for the end-user without even having to look at the final product. With Low, Medium & High fidelity prototypes, one can easily picture an entire flow of how the user journey will look like. All this helps in conveying the look and feel of the final product.

How does it help?

Prototyping is one of the most important steps in the design process. It saves time, effort and cost on a project to validate a hypothesis and ascertain that the product design is in the right direction.

Before a final output is ready and the project is conceptualized. Prototyping helps designers bridge the gap between a conceptual and an actual product.

For designers

For designers, the mode of prototyping they choose varies from project to project. For instance, if there is a quick approval needed even a hand sketch (Low fidelity prototype) will do the job. But if the journeys and flows are extensive a high-level prototype is a must. It helps clear doubts with respect to user journeys, flows and IA (Information Architecture). A designer must have total control over the tools they use, for an excellent output.

For developers

A detailed prototype can help developers visualize a flow from start to end and quickly understand the roadblocks or the enablers that can help smoothen the app or web development. Developers can also recognize the challenges well in advance with a detailed prototype. Additionally, there are many other aspects, such as API availability, asset requirements, and basic structure of the page that a detailed prototype can help developers to be prepared with.

When to use Prototypes?

The prototyping phase is the testing ground – this is where the transition happens from being dogmatic to being experimental.

In its basic form, a prototype is an expression of design intent. Prototyping allows designers to present their designs and see them in action. In the context of digital products, a prototype is a simulation of the final interaction between the user and the interface. Depending on what a product team needs a prototype to do, it can simulate an entire app or just a single interaction.

The fidelity of a prototype refers to how it conveys the look-and-feel of the final product (i.e. visuals, content and interactivity)

An important aspect that should be mentioned here is that anybody can prototype. It is not something that needs to be restricted to a designer only.

Paper mockup

For creating a prototype, we can start with something as basic as a paper mockup. It is inexpensive, fast, and collaborative. A paper prototype can be first ideated on a whiteboard with all stakeholders and then sketched out on paper – it’s that simple.

This method does have its drawbacks though, like limited interactivity and uncertainty during testing, but it suffices for a preliminary test.

Monotone mockup

You then have the monotone mockup which can be static or interactive. An interactive mockup can also include the key transitions.

A designer can be the best judge for deciding the type of prototype that can be created basis what will appeal to the users and project stakeholders. Of course, time is of essence here.

High-fidelity prototypes

The high-fidelity prototypes on the other hand embody the brand, have a corresponding look and feel, clear call to actions, and continuity. These obviously have their own perks, of easy buy-in from and the decision makers, testability of specific functionalities, and richer feedback from users. However, they come with a high-cost implication and time factor.

Process from Wireframes to Clickable Prototypes

Wireframes are created in the early stage of the process and made before the visual design phase. Here the designers pay more attention to usability and functionality rather than aesthetics.

Clickable Prototypes – Low & High Fidelity

A clickable low fidelity prototype is simple to create and has no interactions to showcase the user journey. High fidelity prototypes are easier to understand, with animations, micro-interactions, gestures, fully loaded content, almost equivalent to a final product.

Image source

There are several tools that will help build these high fidelity prototypes with features that help you animate your project the way you want. A few software products used by designers are detailed further.

Top 5 Prototyping Tools

Sketch

Sketch is one of the most popular and efficient prototyping tool for designing Web Interfaces and Mobile Apps. Create minimal and clutter-free designs.

Platform: Mac OS X

Adobe XD

Adobe XD is a perfect tool for UD designers. Easy switching between design and prototype. Also has Voice-enabled feature to create prototypes with voice.

Platforms: Android, iOS, Mac OS X and Windows

Invision

Invision can be used via sketch or other design tools using plugin CRAFT. Designers can quickly create mood boards, Design Systems, and Style Guides. Adapts design from WEB Responsive to Mobile.

Platforms: Mac OS X, Windows and Web Browser

Marvel

Marvel is both Web-based and Mobile app prototyping tool. Through the app, you can convert hand sketches into prototypes. It supports PSD, Sketch files to further work on within Marvel.

Platforms: Mac OS X, Windows and Web Browser

Figma

Figma is the first interface tool to have a collaboration feature. It is an entirely Web browser based tool. Create and present the design in the same tool.

Platforms: Mac OS X and web Browser

Conclusion

Gone are those days when wireframes were created on paper, today prototyping is a must before embarking on the journey of design and development of digital products. Lovely animations and interactions add to the wow factor and help bring a faster buy-in from stakeholders on the concept.

Designers can pick the tool that suits them, as there is no perfect prototyping tool that can be called the “best” from the list. Every tool has its own pros and cons and every day there are new updates to existing and new tools that are launched and marketed differently.

The choice of a prototyping tool depends entirely upon the nature of the project. It is finally about picking the right tool for the right requirement based on the project.

Resources