UX & UI Design – Intellectsoft Blog https://www.intellectsoft.net/blog Wed, 20 Nov 2019 16:25:56 +0000 en-US hourly 1 https://wordpress.org/?v=5.2.4 https://www.intellectsoft.net/blog/wp-content/uploads/cropped-favicon-1-32x32.png UX & UI Design – Intellectsoft Blog https://www.intellectsoft.net/blog 32 32 360-Degree Guide: Tech-Driven Customer Experience Services https://www.intellectsoft.net/blog/customer-experience-services-360-degree-guide/ https://www.intellectsoft.net/blog/customer-experience-services-360-degree-guide/#respond Wed, 17 Jul 2019 14:28:34 +0000 https://www.intellectsoft.net/blog/?p=16956 We explain what CX is today and explore different customer experience services.

The post 360-Degree Guide: Tech-Driven Customer Experience Services appeared first on Intellectsoft Blog.

]]>
Today, every company strives to improve its customer experience (CX). It is a challenging task regardless of the industry you operate in. As new technologies have emerged and consumer expectations changed, the concept of CX has been evolving into something new. As a result, it is hard to pinpoint what CX means today. Also, companies often do not have the resources to make CX improvements on their own, so the question of what customer experience services can bring to the table becomes important as well. 

We prepared a comprehensive guide for you that answers these and more questions, providing real-life examples along the way. The guide will cover the following:

  1. What Does Customer Experience Mean Today?
  2. Why Customer Experience is More Important Than Ever
  3. Types of Customer Experience Services:
    1. Full customer services experience development
    2. Enterprise UX services 
    3. Customer mobile experience services
    4. Stand-alone solution for specific touchpoint
    5. UX & UI design services
      1. Can UI & UX design and development services involve the latest technologies?
  4. Customer experience examples in services of top brands
  5. F. A. Q. 

Let’s start. 

What Does Customer Experience Mean Today?

Customer experience is how an organization interacts with its clients over the course of their relationship, online and offline. Every CX is comprised of touchpoints — moments when a company interacts with a customer. A touchpoint is any type of interaction with a client, whether it is answering a question at a store, a call to confirm delivery details, cash desk service, or an outdoor ad. 

As customers demand more from companies in every industry, the concept of customer experience has expanded beyond commerce. Companies like Google build their campuses approaching employees like retail stores approach customers, that is, aiming at high retention and satisfaction rates. 

customer services experience

Where a retail chain would put up a sale, a tech company company offers its employees entertainment, recreation zones, and other bonuses. In this case, customer experience bears the name “employee experience.” Governmental organizations adapt as well, digitalizing and simplifying governmental services for citizens. As a result, more and more subtypes of CX emerge in different industries, indicating that both commercial and other types of organizations give more attention to catering to their customers than ever before — terms like hotel/guest experience, patient experience, event experience, are now the new normal. 

Why Customer Experience is More Important Than Ever

It’s not just naming for the sake of naming. According to a sweeping report on customer expectations by Salesforce, 67% of customers said their standards for good experiences are higher than ever, with 51% noting that most companies fail short of their expectations for great experiences. 

customer experience examples in services

Salesforce

Every industry is inherently different, so customer experience is different, too. As a result, companies and organizations across industries look at how they interact with clients and improve the experiences based on the nature of the industry, client feedback, and customers’ specific needs. In other words, every industry dedicates more resources to building industry-specific CXs.

For example, hotels do not simply provide a generalised customer experience that rests upon a website, guest services, and a manager who will address guests’ concerns — they think about the big picture, from booking to branded hotel app to new ways to amaze their clients in the face of competition from market disruptors. A generalised customer experience becomes a well thought out hotel experience. 

Creating a solid customer experience brings substantial benefits to any organization:

  • Strengthens brand/image of a company/organization
  • Increases revenue
  • Attracts new customers
  • Boosts customer loyalty
  • Improves customer retention

Most companies do not build customer experiences on their own, more so if they involve the latest technologies — they enlist digital agencies or software and technology companies who offer customer experience services. As the field of customer experience design has been expanding over the years to address the ever-changing customer demand, more services emerged.

Let’s explore them below. 

Types of Customer Experience Services

Customer experience services can encompass everything from building a next-generation retail store to creating a mobile app that would converge all services in one place. So CX is as much about building an Amazon Go type of experience as it is about mobile app UX and UI design services.

End-to-End CX Design (Full Customer Services Experience Development)

Every company has a customer experience, but if you aim at meeting customer expectations at every touchpoint, you need end-to-end CX design. One of its main goals is creating a seamless connection between a company’s physical and digital experiences. End-to-end CX design usually encompasses everything from creating intuitive websites and mobile apps to connecting all the company’s systems.

Amazon is a great example. Enabled by the decision to make an Amazon account the heart of the experience, everything in the company’s CX is simple. Whether you want to buy a product, read a book on the device of your choice, shop at an Amazon Go store, watch a TV show on Amazon Prime — everything is interconnected, simplified, and only a few clicks away. A user only needs to register an Amazon account and provide basic details. 

Amazon uses virtually every technology available in its CX, from IoT to deep learning to robotics. Still, a comprehensive CX does not have to use everything to achieve solid results, even if it operates on a large scale. For example, a bank can transform its branches with web and mobile, a CRM system, embedded software development, and by redesigning the physical space itself. 

Enterprise UX Services 

If CX in commerce deals with improving the process of buying goods/services from a company for its clients, enterprise UX services focus on enhancing enterprise operations so that the company’s employees would work more efficiently and comfortably. A good example comes from Boeing, whose employees now use AR headsets in the wire assembly process instead of continuously consulting manuals. Results are staggering: assembly speed has risen by 25% while errors are down to nearly zero. 

See the video below:

Customer Mobile Experience Services

This type of services involves creating a mobile-driven CX where a company’s application is front and center, converging all its services in one place. 

For instance, Sweden’s leading insurance provider EuroAccident transferred its insurance process to a simple mobile app. The company’s clients can manage every step easily, from setting appointments to managing insurance for their children. Getting a refund is paperless — a user only needs to make a photo of the check, fill out a few fields, and press a button. The app is also integrated with the country’s most popular booking service, the most widespread banking account authorization system, as well as the company’s IT infrastructure. 

customer mobile experience services

EuroAccident

This is service is often offered as part of mobile UI / UX design services, digital transformation services, or UX/UI design and development services.

Stand-alone Solution for Specific Touchpoint

Say, a retail company has everything covered: mobile and web are interconnected, the company gathers user data to better cater to customers, employees at physical stores can anticipate what shoppers might need, and so on. Still, the company wants to strengthen their image and improve their sales further with something fresh. 

Emerging technologies provide a solution. A company can opt for creating an Augmented Reality (AR) kiosk for the store (we will explore an Under Armour example below) or install beacons that would be connected to a mobile app, delivering personalised offers at the right place and time. 

These services can also be referred to as customer experience IT services, as they involve both software development and sophisticated technology solutions. 

 

Build a tech-driven CX by leveraging 11+ years of industry-specific design expertise.

Get in touch with us.

 

UI & UX Design Services

These are typical UI & UX design services you can find on the websites of most software development companies and digital agencies. They include web design, cross-platform design, mobile app design, and so on. 

In the context of customer experience, common UI & UX design services play a secondary role. A company may need them when it already has a solid CX in place, but, for instance, needs to add a new mobile product to it. 

Other UI and UX services might also be useful. Say, a big retail company has built a tablet app for their warehouses themselves, but it does not work properly. Turning to a software development company for UI and UX consulting will provide a solution. 

Can UI & UX design and development services involve the latest technologies?

Yes, common UX and UI services can involve them. A company can create a website with a  virtual reality (VR) feature in mind, or a mobile app with augmented reality. For example, a hotel can set up website-based VR tours of their locations, while an event company can create an AR app allows visitors view immersive AR installations on events’ grounds. 

Customer Experience Examples In Services Of Leading Brands

We briefly explored real-life examples of CXs across industries above, but more of them will give you a better idea of what CX is and what shapes it can take. 

Full Customer Services Experience — Oasis

The U.K. fashion retailer Oasis has merged its website, app, and store experiences into one seamless CX. Whether customers shop on desktop or a smartphone, they can enjoy the same experience, and it extends further, to the brand’s brick-and-mortar stores. The stores’ sales representatives are armed with iPads, enabling them to give customers accurate product information on the spot, as well as use the tablets as cash registers. If an item is out-of-stock at the shop, the sales representative can book it online and order delivery to the customer’s place of choice. The company’s flagship store also incorporates eating, drinking, and beauty areas

full customer services experience

Oasis’ Flagship Store 

Enterprise UX — AF Gruppen

One of Norway’s biggest construction companies has transformed their core processes with the help of mobile, geofencing technology, and ERP software. As AF Gruppen is often tasked with massive projects like building roads, it often needs to set up the necessary infrastructure in the middle of nowhere. Managing the flow of materials as well as numerous partners is also hard. 

The solution helps to tackle all these issues. With the mobile app, drivers record the process of loading/unloading materials. Geofencing technology helps monitor the movements of the partners’ representatives at a project location, enforcing security, as well as track time of AF Gruppen’s employees. All the data is synced to and consolidated in the company’s project portal, giving it a bird’s-eye-view of any project. 

enterprise ux services

AF Gruppen 

Stand-alone Solution for Specific Touchpoint — Under Armour 

For one of its stores, Under Armour created an AR kiosk that lets users apply signature objects of sports stars to their photos: Stephen Curry’s mouthguard, The Rock’s headphones and sunglasses, and other. Plus, users pose alongside a 3D animation of the chosen star and can share the photo on social media right away. The solution refreshes the in-store experience as well as helps Under Armour learn more about their shoppers.  

Start building a seamless and engaging CX for your business.

Get in touch with us.

F. A. Q.

What is the difference between customer services and experience design?

A customer service is what  a company offers to customers (insurance policy management, package delivery, etc.), while experience design deals with how a company should offer its products or services to customers at every touchpoint (implementing an AI-driven chatbot in an insurance company’s app for customer support, ensuring managing package delivery on desktop is as simple and quick as possible, etc.).

What are customer experience IT services?

Customer experience IT services help companies cover any software and technology needs related to their CXs. This could be anything from a CRM to tablet app for warehouses to AR storefront.

How can I find a fitting partner for UI / UX design or customer experience services?

If you need UX and UI design services, choose between a digital agency and a software development company. The first option will give you more expertise in marketing, the second in software development. Still, an agency can have solid software developers, and a software development company the required marketing expertise, acquired in completing projects similar to yours. As you will be focusing on expertise and completed projects to select the right partner for UI / UX design services, you can search among both. 

If you need customer experience services, seek out companies that focus on CX, not simply offer it alongside many other services. This could be an IT/software development company or design agency.

Whether you need to find a partner for UI & UX design or customer experience services, you need to carry out a comprehensive research, especially if you plan a major overhaul of your CX — not too many companies offer end-to-end CX design. You can find fitting companies on websites of consulting companies and research firms like Clutch.co, they rate and profile services providers regularly. Asking your business partners or people you know about a potential partner can help you in finding one for UI & UX design or customer experience services as successfully as in any other case where you need a 100% reliable partner. 

The post 360-Degree Guide: Tech-Driven Customer Experience Services appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/customer-experience-services-360-degree-guide/feed/ 0
The 5 Best Mental Health Apps (& What Makes Them Succeed) https://www.intellectsoft.net/blog/best-mental-health-apps/ https://www.intellectsoft.net/blog/best-mental-health-apps/#respond Mon, 18 Nov 2019 15:53:46 +0000 https://www.intellectsoft.net/blog/?p=17541 We take a close look at the best products on the burgeoning market.

The post The 5 Best Mental Health Apps (& What Makes Them Succeed) appeared first on Intellectsoft Blog.

]]>
As apps for mental health are becoming more popular and the market is far from being saturated, building a mental health app may well become your next successful venture. To give you an understanding of what the market looks like and its many nuances, we hand-picked the best mental health apps available right now and pinpointed what made them succeed. 

We did not include Headspace and Calm, as these are highly popular and well-advertised applications, instead opting to focus on unique mental health apps recognized across different categories. 

Lets’ start.

BlueIce 

Category: Evidence based mental health apps for youth and kids

BlueIce is aimed at helping teenagers manage their emotions and prevent self-harm with a wide variety of different features. Available for both Apple and Android devices, the application was developed by Paul Stallard from Oxford Health NHS Foundation Trust (Foundation Trusts are NHS’s organizations with a strong local reach). To make it as effective as possible, teenager with lived experience of self-harm took part in the process of creating BlueIce.

Here are the key features:

  • Mood checker with notifications
  • Simple mood diary
  • Mood lifter with a set of proposed activities
  • Emergency contact numbers
  • Additional protection and privacy layer with PIN
  • Personalized sections
  • Smart safety checks for self-harm prevention

Now, let’s take a quick look at BlueIce’s biggest features — Mood Checker and Mood Lifter. 

The first relies on a “mood wheel”: a user chooses how they feel from a wide range of options on the wheel, take short notes, and then can identify mood patterns and triggers in the Mood Calendar across long periods of time. 

evidence based mental health apps

Meanwhile, the Mood Lifter section offers a comprehensive activity suite aimed at lowering stress. 

Here are its key components:

  • Music and photo libraries
  • Physical activities
  • Mood-changing activities
  • Mindfulness and relaxation exercises
  • Contact a friend
  • Negative thoughts spotting

evidence based mental health apps

BlueIce’s trial showed that the app can help teenagers manage their stress levels and self-harm urges alongside traditional face-to-face communication with a mental health professional. This and its comprehensive approach make BlueIce one of the top mental health apps available. The application is free, but prescription-only.

Cove

Category: Music Apps For Mental Health

Not everyone will enjoy writing down their thoughts into a mood journal, looking for other ways to improve well-being. Highly praised by top publications like Wired, The Next Web, and Guardian, the Cove app address that by offering simple music-making tools and eye-pleasing visuals designed for reducing anxiety and stress through self-expression. The process is easy: a user selects one of the six moods and then taps to choose chords, melody, and instruments (more than thirty are available) to create their own songs.

music mental health apps

Cove was developed with the help of clinicians and other medical experts as well as tested, evaluated, and trialed in the NHS and other health organizations. Although Cove won’t replace professional treatment, it can be used alongside talking therapy and counselling, or simply to relax for a few minutes and enjoy the process of creating music anywhere you find comfortable.

Users have met Cove with high praise, mentioning its therapeutic effect, that it helps to cope with negative thinking, and has easy-on-the-eye visuals. As for the media, Guardian called it one of the best medical apps, and Wired UK wrote that Cove will upend user expectations when it comes to what a journaling app can be (Cove can be referred to as a music journaling app). 

The app is available for free for iOS devices only. 

Xmed Health

Category: Social Media-like Apps for Mental Health 

Although social media platforms have grown to be stress-inducing for many users, people’s love for socializing online can channeled to alleviate modern stressors and solve other mental health issues. The Xmed app may be the best example of that, offering users a health and lifestyle mobile ecosystem, a social network, and artificial intelligence (AI) algorithms in one package.

Here is how it works: AI asks a series of questions to identify a user’s health issue, juxtaposes that data with available medical data and information provided by other app users, and arrives at a conclusion. The user can then start talking with certified mental health professionals to tackle the problem, as well as discuss it with people who have the same issue in the app’s in-built social media network. 

social network based mental health apps

Apart from its uniqueness and technological capabilities, the Xmed Health also has a well thought out flow, whose primary focus is to help a user solve their issue, beautiful design and animations, and gamification with levelling up and achievements. 

On top of all this, you can use the app to identify other health issues. making Xmed Health not only one of the best mental health apps, but also a solid health app in general.

Xmed Health is available in the Appstore. 

My Possible Self

Categories: Mental health therapy apps, Mental health tracking apps

My Possible Self promises to help its users lower stress and anxiety levels in eight weeks with a range of features backed up by clinically approved content. To deliver on the promise, the app offers over a wide range of learning modules aimed at various stress-inducing situations in life. 

The modules include:

  • Stress and overload management
  • Fear and anxiety management
  • Overcoming loss and big life changes
  • Problem solving
  • Happiness and well-being management
  • Tackling negative thinking
  • Returning to pleasant activities
  • Improving daily communication

The list does not end there, as the app’s creators continuously update it with different new modules. The first learning module is free, but to access the rest users needs to have a subscription. 

mental health therapy apps

Still, the app has a number of other aspects that make it one of the best mental health apps. There is a comprehensive mood tracking tool/dairy, created with the help of the company’s in-house psychologists. A user can track their mood daily, selecting how they feel and pinpointing activities, people, and places that influence their mood and well-being. 

Working alongside the tracking tool is the Mood History and Insights features that help users detect mood patterns and act accordingly to improve how they feel. The latter displays mood shifts in a comprehensive chart, showing the patterns and proposing potentially suitable lifestyle changes with the help of custom algorithms. What is more, users can add written notes and images to every mood entry — a small but nice touch that enriches the experience.

The content used in My Possible Self is clinically and statistically proven to lower stress and improve well-being in an eight weeks’ time. To ensure that, the creators partnered with a leading non-profit mental health research facility called The Black Dog Institute. 

My Possible Self was warmly received by users and praised by media outlets like London Evening Standard and Buzzfeed. Is is available both in the Appstore and Google Play.

Happify

Categories: Event based mental health apps, Gamified mental health apps

Happify has a lot to offer. The app uses a set of comprehensive features that rely on science-based games and activities to help users fight stress consistently across all life areas. 

At the app’s centre are Tracks, a section with stretches of different simple activities that help users improve their well-being on a daily basis. These include, for example, singling out small moments in your day that made you feel good and choosing a person to be thankful to. Every user has a progression scale for each track as well as six skills they upgrade by completing it: Savor, Thank, Aspire, Give, Empathize, and Revive. There over sixty available tracks for different aspects of life, part of them only through subscription.

gamified mental health apps

For those who want small bits instead of a long progression, there is an Instant Play section. Here, users can complete activities separately for each of the aforementioned skills. 

Other features include: 

  • Happify Daily — articles, videos, infographics, and other types of content related to improving emotional well-being
  • Community — a minimalist social network users can choose to be part of and share the activities completed for the skills with others
  • Negative Knockout — a game where you bring down your negative emotions in style of Angry Birds.

The feature list is bigger still. For example, the app offers a twenty-page character strength report for each user, compiled in partnership with The VIA Institute. Meanwhile, Happify’s approaches were developed by leading scientists and experts in positive psychology, cognitive behavioural therapy, and mindfulness. 

Happify was widely praised by users and media, including reviews in ABC World News and The New York Times. The company also claims that eight-six percent of their regular users report improved well-being in two month since they started using the app. 

Happify is available for iOS and Android. Part of the features are free, while the rest can be accessed by subscribing. 

What Makes Top Mental Health Succeed

There is a pattern to why the aforementioned mental health apps enjoy success — they all tick the same important boxes. Here are the success factors:

  • Mental health professionals should be involved in as many stages as possible
  • The app should have a diverse set of features for a user to choose from 
  • The features should be backed up by scientific research
  • The app should have its unique feature, or approach a common feature from a different angle
  • Mood journal is an important feature
  • Gamification helps to keep the users engaged
  • The app should have an appealing design

Now that you have taken a closer look at the top apps for mental health and what makes them so, you can start planning your own unique mobile product for those who want to tackle their mental health issues in a handy, clear, and pleasant way.

Good luck!

If you want to learn more about digital healthcare technologies, see some of our recent articles on the topic:

  1. Trends in Connected Health & Wellness Devices
  2. The Current State of IoT in Healthcare

If you need a consultation about your mental health app or other healthcare project, get in touch with our experts.

The post The 5 Best Mental Health Apps (& What Makes Them Succeed) appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/best-mental-health-apps/feed/ 0
Google I/O 2017. Designer’s Point of View and Lots of Sketches https://www.intellectsoft.net/blog/google-io-2017-designers-point-of-view/ https://www.intellectsoft.net/blog/google-io-2017-designers-point-of-view/#respond Tue, 30 May 2017 01:21:24 +0000 https://stanfy.com/?p=14105 Google I/O is a unique conference where for three days you are exposed to the sun and fresh air and immersed in non-stop learning and inspiration.

The post Google I/O 2017. Designer’s Point of View and Lots of Sketches appeared first on Intellectsoft Blog.

]]>
Google I/O is a unique conference where for three days you are exposed to the sun and fresh air and immersed in non-stop learning and inspiration. This year was my first Google I/O and in addition to attending technical sessions and 1:1 app reviews, everyone had the opportunity to talk directly with Google designers and engineers and plenty of possibilities to connect with other participants and to have fun in between.

I sketched a lot during most of the sessions. In this quick overview, I want to share with you my sketches from the talks and the summary of what I learned.

01_io2017_keynote

Hot stuff

google io 2017

There were several topics that drew my attention as a designer:

  • Understanding conversational interfaces and the design process for voice-first applications.
  • Assisting drivers. This topic overlaps with conversational interfaces and raises the issues of multimodal interactions.
  • Web applications as an evolution of responsive sites and their role for first-time internet users.

Conversational interfaces

Shifting to a voice interaction model requires people to change already established habits around multi-touch interaction and most likely this will be neither an easy nor fast process.

However, there is no doubt that conversational interfaces will become the primary way for our interactions with online services in the future and it is a good time to start learning how such interfaces should be designed.

  1. Users’ memory span is very short—on average you are dealing with 5-9 word phrases. So avoid information overload and keep your assistant’s messages very short: structure information in a way that supports the recall, ask questions that are easy to answer, and break messages into two parts.
  2. People are experts in conversations (embrace this), which is why they have a very low tolerance for system errors. So ALL errors will be the system’s fault.  Spend time developing a strategy for exceptions; make it easy for a user to get back on track; leverage techniques that we use in everyday conversations.
  3. The Google team is eager to feature your app for assistant and there are several criteria they are using, asking themselves: Did I smile? Did I LOL? Did I learn something? Will I use it again? Would I use it every day? Would I tell someone about it? Can I pick up where I left off? Did it do what I expected?  On the other side: Was I confused at any point? Did I have to repeat myself? Did it have a nice re-prompt?
  4. There is two type of errors in human-to-computer voice interactions: no input (you didn’t get any input from the user) and no match (you got input but you were not prepared to handle it). You should consider users’ context and the sequence of the questions, think about why they didn’t respond, try another strategy or re-prompt: repeat the initial question.  Each time you re-prompt look for opportunities to add variety and ask in a new way or escalate for details.

Google clearly wants to put Assistant into any device around you. At IO they showed open source projects with the Google Assistant SDK – DIY robotic cocktails mixer and the Do-it-yourself AI for Makers.

diy mixer google io 2017

You can read Google’s guide on conversational UI here and check my sketch below. 😉

Sessions worth watching:

Join Google challenge and submit your app for assistant by August 31st!

Assisting drivers

Android Auto now works right on your phone screen, or on your car display. At IO, Google presented two cars, Volvo and Audi, with Android Auto software onboard.

  1. Main principles to keep in mind when designing an app for cars: minimize distractions and reduce cognitive load.
  2. Google created a system that enables automotive use templates to safely and predictably perform the most common driving-related tasks.  For example, if you are Spotify, you will create an API for Android Auto and OAM will be able to include it in the car, but you won’t control the look and feel of your app. This is really make sense – each time the driver switches between, let’s say, Spotify or SoundCloud, you don’t want them to have to learn a new interface.
  3. When building a product for various platforms and surfaces consider users’ interaction model (which input/output mode is the strongest: audio, video or haptic?) and the user conditions (Are they on the move? Are they in private or shared environment? Can they access the screen?).  You should understand which mode is the strongest and optimize for it.
  4. Google wanted to show that Android in the car is a good way for application developers to deliver their content for drivers in the way they could not do before and that the car manufacturer (OAM) can bring really nice user interface and all the opportunities of the Android to the driver without compromising their brand identity: Android inside Audi will feel like Audi.

android auto ui ux

android auto io 2017 google
Android inside Audi will feel like Audi.

Sessions worth watching:

Web applications as evolution of responsive sites

creating right ux google io 2017

For the last 7-8 years I have been focused on designing for native mobile interactions and building web apps always was a compromise between quality, performance and app capabilities. You can create such a better user experience if you design a native app!

But it looks like things are changing.  The web is becoming a platform for lightweight apps that can be accessed on-demand, installed without friction, and incrementally updated.

Progressive Web Apps (PWA) allows you to create a radically better web experience on mobile and in many cases it may be the only app you will build — for web, for iOS or for Android.

  • PWA fits any form factor: desktop, mobile, tablet, or whatever is next;
  • allows users to work offline or on low-quality networks;
  • feels like an app;
  • makes re-engagement easy through features like push notifications;
  • allows users to add apps they find most useful to their home screen without the hassle of an app store.
Example of how you can customize web app depending on the platform (iOS or Android)
Example of how you can customize web app depending on the platform (iOS or Android)

Several quick and quite impressive facts:

  1. Twitter. Mobile accounts for over 80% of Twitter’s usage, with many users reaching the site via 2G or 3G networks. With the launch of the new web app they reported a 65% increase in pages per session, 75% increase in Tweets sent and 20% decrease in bounce rate.  The Twitter web app is fast and responsive, uses less data, takes up less storage space, and supports push notifications and offline use in modern browsers.  Check case study here.
  2. Forbes reports a 100% increase in sessions on mobile since they launched mobile web app.
  3. Olacabs (leading cab aggregator in India, 1M rides every day) were able to reach new markets in the Tier 2-3 cities, where people use very basic Android smartphones and often don’t install apps at all. They achieved a 68% increase in mobile traffic in Tier 2 and 3 cities. Ola also noticed that 20% of users who book using their PWA had previously uninstalled their app. By reducing the amount of storage space needed, the PWA allowed them to effectively re-engage with their previous app users.
  4. Alibaba reports a 76% growth in conversion on the mobile web.

progressive web apps progress

Sessions worth watching:

Designing for new internet users or the next billion users

Last year Google saw over 100 M new internet users come online in India but 65% of India’s population is not yet online. So, projecting forward, various experts suggest that by 2020 there will be about 1 billion unique mobile subscribers in India alone. And that is just in India. Google sees similar processes happening in countries like China, Brazil, Nigeria.

So all these people might be your new future users. And their first internet experiences are on mobile phones (not desktop), a lower-end device (limited storage, RAM, old OS) with a slow and pricey connection and rare WiFi access.

And even if you are not focused on reaching users from these emerging markets, by building products that are fast and use less data, you will delight your savvy internet users as well.

next billion google io 2017

So new internet users are facing very different constraints when accessing the internet:

  • 33% of smartphone users in India run out of storage space every day and 83% people delete stuff every week.
  • 50% of the users in India and 2/3 in Nigeria have 2G connections, so a lot of them are not really connected all the time. If you are building a product that relies on constant updates, that is not going to work out for you—you need to make sure that your product is fully functioning offline.
  • People buy prepaid packages of data (10 Mb or 100 Mb) and use them really consciously, often turning on and off Airplane mode, keeping track of which app is using up data and how much.

Screenshot-2017-05-29-21.09.11

Therefore, when building the product for these new markets keep those things in mind.

  1. For data-heavy tasks provide transparency and control over data consumption (ex.: give the option to preview the content before it is loaded).
  2. Make great connectivity the edge case. Expect latency and allow offline mode (optimize for bandwidth constraints and inconsistent connectivity).
  3. Design clearer, larger, farther-apart affordances to prevent mistaken taps caused by bad or broken screens.

Screenshot-2017-05-29-21.07.07

Sessions worth watching:

google io 2017 and dresses

The post Google I/O 2017. Designer’s Point of View and Lots of Sketches appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/google-io-2017-designers-point-of-view/feed/ 0
A Developer’s Perspective on Designing for iOS Applications https://www.intellectsoft.net/blog/a-developers-perspective-on-designing-for-ios-applications/ https://www.intellectsoft.net/blog/a-developers-perspective-on-designing-for-ios-applications/#respond Fri, 26 Aug 2016 18:45:56 +0000 https://www.intellectsoft.net/blog/?p=2998 An experienced designer once told me that UI is more of a process than a fixed structure. It’s in constant flux. It is inconsistent by nature. And it’s complicated to make. So is UI the antithesis of clean and structured code? An experienced iOS developer designs code that is easy to change.

The post A Developer’s Perspective on Designing for iOS Applications appeared first on Intellectsoft Blog.

]]>
An experienced designer once told me that UI is more of a process than a fixed structure. It’s in constant flux. It is inconsistent by nature. And it’s complicated to make. So is UI the antithesis of clean and structured code?

An experienced iOS developer designs code that is easy to change. It means that if you need to change something that appears in multiple places within your app, it’s enough to modify  one place in your code to fix them all. What tools do we have to make this happen?

First of all, we have UIAppearence which is an powerful tool but lacking in flexibility. It works best for UI elements that don’’t have use more than one style, such as UINavigationBar or UITabBar. But if you need to change the color of your navigation bar with a single controller (some modal view, perhaps) you need to override this directly in UIViewController. Little-by-little your code will be crowded with these small hacks which make it painful to maintain and implement quickly. Also, this will likely lead to various bugs.

Since we know that UI elements in applications belong to groups with identical appearance (let’s say all UISwitches) we can make some use of it. Probably, we can create a library of UI controls that are used within our application. UIButton sub-classes for similar buttons and reused related UITableViewCell’s. As long as you can do it without inheritance and complex hierarchies of classes it works fine. (You know that inheritance could be your worst nightmare, don’t you?). But that’s a lot of code.

So, the team at Intellectsoft  decided to take some time to creating something which:

  1. Will allow us to use system classes (so we don’t have to spread our attention too thin).
  2. Will require less code.
  3. Will be simple.

After spending some time with my colleague, we came up with the idea of applying styles for UI elements. Each system class would have a predefined set of styles and all you have to do within your UIViewController is to apply it. If we need to add another style it will not affect any other elements, and you can change styles in one place.

Let’s dig into the code shall we?

As long as we are writing in Swift and following Apple’s advice on protocol-oriented programming, it’s natural that we start with a protocol.

Screen Shot 2016-08-26 at 4.31.35 PM

Pretty simple. It’ only defines a function that performs styling. So we decided to add another protocol and extension to it with a default implementation. All UI elements that need to be styled (we don’t have to style everything of cource) will adopt that protocol.

Screen Shot 2016-08-26 at 4.32.54 PM

I hope this makes sense to you.

Here is an example of UILabel styling:

Screen Shot 2016-08-26 at 4.33.40 PM

And using it in your code is quite simple and doesn’t take much time:

Screen Shot 2016-08-26 at 4.36.16 PM

If you find this approach useful give your credits to my awesome colleague@EdPanasiuk who made this workable and myself @ankoma22. You can reach out to us on Twitter if you have any questions.

The post A Developer’s Perspective on Designing for iOS Applications appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/a-developers-perspective-on-designing-for-ios-applications/feed/ 0
Apple TV. Understanding the Design Principles (with infographics) https://www.intellectsoft.net/blog/apple-tv-understanding-the-design-principles-with-infographics/ https://www.intellectsoft.net/blog/apple-tv-understanding-the-design-principles-with-infographics/#respond Tue, 29 Sep 2015 13:57:29 +0000 https://stanfy.com/?p=10520 Key things to keep in mind if you plan to develop an application for Apple TV: design approach, possible use cases, and a new interaction model.

The post Apple TV. Understanding the Design Principles (with infographics) appeared first on Intellectsoft Blog.

]]>
Key things to keep in mind if you plan to develop an application for Apple TV: design approach, possible use cases, and a new interaction model. At the end you will find infographics with the summary of tvOS Human Interface Guidelines.

The new Apple TV doesn’t bring innovation to living rooms but instead will certainly drive short-term adoption and popularity of the connected television. Unlike other companies in this sector (LG, Samsung, Panasonic and Sony) Apple finally has done it right from the user experience perspective by introducing an easy to use interface combined with the new remote, universal search and a large selection of apps (in the future).

Apple TV Design Principles

New TV apps can’t simply replicate smartphone or web apps, and if you want to expand your existing product to the TV screen you will need to discover compelling use cases by creating an experience that wasn’t viable before.

But what kind of experiences should apps bring to TV users and what factors should we consider when thinking about developing such apps?

We’ve visualized tips of “Apple TV Design Principles for App Developers” in a presentation and one-page infographics.
Download PDF.

Design approach

Creating great products begins with understanding the goals of the people who use them. As a designer at Stanfy, when I start working on a new project there are three main questions I want to answer first:

  1. Who are the users?
  2. What problems would this product solve for them? What benefits would people get from using it
  3. What is the context or situation in which the product would be used?

Apple TV Apps

Obviously the audience for TV apps is very wide but apps that embrace the communal nature of the living room or public spaces will be the real winners on this platform.

So we should definitely consider what kind of shared experiences we can create and how our app will appeal to a group, but we also should think about personalization and what will appeal to a single user.

When we think about TV, the environments for it are the living rooms, shared office spaces, universities, cafes, gyms, hotels or other public premises. And there are specific cases that can be targeted in those contexts.

Possible use cases

The obvious use cases — consuming media, playing games, watching media streams and communicating with friends and families. But beyond that areas apps for Apple TV have the potential to empower TV screens and allow you to engage viewers more efficiently.

Apple TV apps uses and use cases

For an office space you can build an app to inform your teammates about the latest updates and industry insights, share photos from team events, showcase company’s metrics or show the dashboard of Instagram or Twitter stream with the specific hashtags.

For a restaurant or cafe you can create an engaging experience for customers: share great Yelp reviews, showcase featured dishes, display your menu or instantly share customers’ Instagram and Twitter posts. TV wait-list apps can help to keep track of wait time and showcase a real-time waitlist for guests to see their spot in line.

In the family environment, different productivity apps with shared options, sport activities dashboards, shopping and cooking apps could transform the TV into something more than just a movie hub.

Also, you may think of providing some useful content on top of any media. For example, you could make a streaming app that together with video displays additional information like tweets from customers or Viber messages from friends or family who are watching the same content and want to exchange opinions.

New interaction model & interface guidelines

Apple TV brings new interactions to a TV screen. Let’s talk about the most important.

Focus-based interactions

The remote is used to interact indirectly with elements on-screen from across the room. The interaction is fully based on a focus model. By pressing buttons and swiping, users move their focus from element to element, stop and click to access particular content.

We don’t need a cursor as people will navigate simply by changing focus.

Mind the gap

On Apple TV, users see the screen across the room so you should think carefully about user interactions and the sizes of the text and interface elements. Apple gives precise recommendations on that.

You have to minimize the amount of text in your app and seriously consider using more pictures or animations rather than writing about something. When using typography, follow Apple recommendations on font sizes to make sure your interface is legible at a distance.

Remote interactions

Remote has a touch surface, an accelerometer, and a gyroscope that you can leverage in your app to deliver a compelling experience.

You must make the remote usable as a game controller and you should always implement some behavior for the Play/Pause button. Unused buttons feel broken. For example, the Play/Pause button can trigger the same behavior as a click to activate a focused item.

With the new Apple TV, users expect to press the Menu button to return to a previous screen or the main Apple TV Home screen. Implement backward navigation by using the Menu button instead of introducing a separate Back button.

Layout templates

TVs vary in size and TV app layouts don’t automatically adapt to the size of the screen. That is why you should pay special attention to this fact when designing the layout, to make sure that it looks great in a variety of screen sizes. Optimize assets for the big screen. Design interface for a screen resolution of 1920×1080 pixels (1080p, 16:9 aspect ratio).

On the Apple site you can find particular recommendations on designing an app’s layouts and also templates for different needs that are easy to browse at a distance, and are quick to navigate with the remote.

Navigation

Apple created standard navigation components such as page controls, tab bars, segmented controls, table views, collection views, and split views. They can cover most of your UI needs so use them to provide an optimal viewing experience.

Also you should keep in mind that swiping to the side is easier than swiping up and down so you should consider this when choosing or designing layouts for your content.

No Web browsing

There is no web browser on Apple TV and moreover – you can’t open web pages inside your app either. Webkit, the framework that allow developers to include webviews in their apps, is missing from tvOS. For example, on the TV you won’t be able to open links posted by someone you follow on Facebook or Twitter.

Why would Apple do this? The main reason is that they want to control user experience. A big, non-retina screen is not going to render web content well and a mobile browser also has a number of interactions that simply are not available on the tvOS.  Also, this way Apple makes sure that non-native apps with poor overall experience won’t appear on Apple TV.

Apple TV Apps Guidelines Infographic
Apple TV Apps Guidelines Infographic

Key takeaways

  1. People mostly enjoy watching TV in a shared environment so, when creating a TV app, think about experiences that you can bring to a group of people.
  2. Touch or click interactions that people are used to on other devices are now focus-based. Use the remote’s touch surface, accelerometer, and gyroscope to help people feel connected to your app even though they’re sitting at a distance.
  3. You can build a fully customized interface for your app but do refer to Apple’s recommendations on grid parameters, interface component sizes, spacing, typography and layout templates to make sure your content is easy to browse at a distance and navigate quickly with the remote.

Welcome to the new apps world for Apple TV 🙂

The post Apple TV. Understanding the Design Principles (with infographics) appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/apple-tv-understanding-the-design-principles-with-infographics/feed/ 0
Design Case Study: Transplant Hero https://www.intellectsoft.net/blog/design-case-study-transplant-hero/ https://www.intellectsoft.net/blog/design-case-study-transplant-hero/#respond Mon, 08 Jun 2015 13:28:31 +0000 https://stanfy.com/?p=9744 Transplant Hero is a medication reminder app that is the brainchild of Dr. Jay A. Graham, a transplant surgeon in New York.

The post Design Case Study: Transplant Hero appeared first on Intellectsoft Blog.

]]>
08

Transplant Hero is a medication reminder app that is the brainchild of Dr. Jay A. Graham, a transplant surgeon in New York. It helps transplant patients follow a strict anti-rejection medicine regimen after an organ transplantation. At Stanfy in collaboration with our client Dr. Graham we designed the iPhone app experience, created a name and a logo for the product, and finally brought the solution to the iOS marketplace.

In this post I would like to share with you our design process and lessons learned. Together, we put our whole collective heart and soul into this project and even if Transplant Hero can prevent one rejection — it was well worth it!

Understanding the problem

After an organ transplant, patients need to take immunosuppressant drugs that help prevent their immune systems from attacking the new organ. Typically, the drugs must be taken for the patients’ lifetimes, at all hours of the day and night from two to four times a day.

This creates a serious challenge for patients — research shows that 15% of graft losses happen due to immunosuppression non-compliance. In 2014 alone around 30 000 transplants were performed in the US. That means that around 4500 of them may have serious problems due to medication non-adherence.

Why are the numbers so high? Why do people whose lives depend on the tiny pills keep breaking their medication regimens and repeatedly forgetting to take pills on time? Why don’t existing reminder apps help?

TH 2

Understanding the people

Our design process starts with the people we are designing for and ends with the solution that suits their needs. Research is a reliable way to gain insight into people’s’ lives and to create a compelling experience for them.

For this project we chose to conduct generative research with the goal of stepping into transplant patients’ shoes, to understand their lives and solve problems from their perspectives, and to to find answers to such questions as:

  • What is the exact problem we are solving?
  • Who are we building this for?
  • What is the context in which our users will interact with what we are designing?

TH 3

The research included a series of informal interviews with patients and a subject matter expert (the transplant surgeon), and a review of existing literature.

We asked transplant patients about a variety of topics, including their lives before the surgery, how they changed after, difficulties they are experiencing in relation with their medication regimen, and their computer and mobile habits.

The interviews allowed us to get the following valuable insights:

  • The patient’s life is changing dramatically for the better within several weeks after the surgery.
  • Within weeks of leaving the hospital patients find that that they have more energy and the world has become “brighter”.
  • During the first several months patients feel overwhelmed with information; they need to learn about their new organ, how to take care about it, and how to avoid rejection and infection.
  • Patients hardly notice that they miss their anti-rejection medicine sometimes.
  • Transplant patients often treat the day of the surgery as their second birthday.
  • Patients do forget about taking their pills on time even though they fully realize that it may cause the rejection of their transplant organ.

Defining the vision

Our next step was to transform our research into meaningful and actionable insights that would become the foundation for the design.

At this stage we were looking for answers to these questions:

  • What should we make?
  • How should it work?
  • Why should people care?

We conducted several ideation sessions within the team and the client to make sense of what we learned and come up with experience and design principles for the product.

Experience Principles and Design Criteria

  • Transplant Hero is your smart guide to the anti-rejection medicine. It minimises the patient’s work on medications setup and does the heavy work on proper pill scheduling.
  • Be a friend, not a doctor. Transplant Hero builds a personal connection with the patients and encourages them to follow the medication regimen. By taking medications regularly a patient is rewarded by fun and cool awards.
  • Transplant Hero is all about transplant patients and their medications. It anticipates the medications needs of the transplant patients and content that is universal for the transplant patients is predefined.
  • Transplant Hero is the bright part of your post-transplant life. The application’s visual language emphasizes the new, energetic patient’s life, far away from a hospital.

The application inspires, encourages, and gently but persistently prompts patients about their medications times.

Designing the experience

Once we identified opportunities for design we started sketching out concepts quickly to illustrate the user experience with our app and prototype several possible experience solutions.

The Engagement Flow

A big part of our discussions was the “engagement flow”, the “secret sauce” of the Transplant Hero that is supposed to get patients to stick with the app and seamlessly, playfully help them to get used to keeping track of all of their medications.

TH8

Eventually we came up with the flow that involves the user in the game and challenges him to earn cool rewards towards eventually becoming a Transplant Super Hero.

TH9

Minimal Viable Product (MVP)

Our goal for the first release of the app was to design and develop a minimal viable version of the product that:

  • would cover the main user needs,
  • would engage users;
  • would be created with reasonable amount of efforts and investments;
  • allow us to gain feedback and learn how to improve the app.

We decided to focus on two basic uses:

TH10

Creating a design prototype

Following the design criteria that we agreed on before we came up with the user interface concept for the application.

TH11

Than we applied a little bit of color magic and here is our beautiful Transplant Hero!

TH12

Defining the key product metrics

“Don’t just ask questions. Know how the answers to the questions will change your behavior,” Alistair Croll stated in Lean Analytics.

The metrics that we will choose to track over time should help us to make design decisions and avoid unnecessary implementation efforts. Also the clear set of metrics allows us to indicate the progress of our product.

In Transplant Hero one of the most important goals is in the engagement category: we want our users to “checkin” all their meds every day. To identify this we need to calculate the ratio between checked in and prescribed medications.

Other information that is also important for us is understanding what stops patients from becoming our regular users. To do this we can track the retention rate, how many of the active users from a given time period are still present in some later time period.

The third issue that is important is the percentage of users who installed the app and successfully went through the medication setup flow. This can give us a hint about what turns off some users from the app at the very first launch (fears, questions they may have) and how we can improve that.

TH13

Key metrics:

  • Missed rate per active* user per week — the ratio between checked in and prescribed medications (by active user we mean a user who checked in at least one medication during the last 7 days)
  • Retention rate per user per week — percentage of users who are active after 7 days
  • Activation rate per user per week — percentage of users who successfully scheduled their medications

Build it. Learn. Iterate

In development we followed the Agile process and it took us about 5 one-week sprints to release the first version of the app.

The flexibility of Agile and the ability to test the app every week gave us a chance to improve the user experience and refine some ideas during the development cycle. As a result, the scope has grown but together with that it has allowed us to deliver a better product.

TH14

Almost immediately after the app went public we started to gather feedback from the early users and learn.

TH15

For example, together with the client we found out that the majority of the patients don’t religiously follow the doctor’s prescriptions and prefer to customize their medications schedule. Other patients have specific needs to schedule medications every other day or have different dosages in the morning and evening time.

This feedback contradicts our research findings and the design principles that we defined for the app — that the app should do all the “heavy lifting” on scheduling medications. As such, it meant we needed to pivot and adjust to our user expectations.

At this point we have released three new versions of Transplant Hero that take into account these specific needs of transplant patients and we continue to listen and to learn.

On the bright side — we are getting overwhelmingly positive feedback from people who love the app and it encourages us to see that we are on the right track!

TH16

Just in one month after the launch, Transplant Hero has been selected as a Platinum Award winner of the Best Mobile App Awards, under the category of the “Best Mobile App User Interface”!

Moreover, Transplant Hero has been featured on the prestigious American Society of Transplant Surgeons website as well as many community support group pages.

The post Design Case Study: Transplant Hero appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/design-case-study-transplant-hero/feed/ 0
Work In Progress: How To Design an Apple Watch Application https://www.intellectsoft.net/blog/work-in-progress-how-to-design-an-apple-watch-application/ https://www.intellectsoft.net/blog/work-in-progress-how-to-design-an-apple-watch-application/#respond Tue, 07 Apr 2015 17:15:51 +0000 https://stanfy.com/?p=9293 Pre-orders of Apple Watch are to start later this week, and the level of excitement by both users and developers is reaching its highest level.

The post Work In Progress: How To Design an Apple Watch Application appeared first on Intellectsoft Blog.

]]>
Pre-orders of Apple Watch are to start later this week, and the level of excitement by both users and developers is reaching its highest level. Although there are quite a bunch of watches running Android Wear or proprietary operating systems, the one that fits into the Apple ecosystem is definitely a big deal.

Developers and designers here at Stanfy, as well as in the rest of the world, have been toying around with the new platform for a while. Hundreds of new apps are being developed as we speak, even though the only way to see how your app would look like on the actual gadget is running it on an emulator.

One of our projects for Apple Watch is an extension of Waterbalance, an iOS application that we developed back in 2013. Here we share a few insights on the development process and what are the challenges a designer may face.

What is Waterbalance

Created to help people stay hydrated in the hustle and bustle of our everyday life, Waterbalance is an application that allows everyone to track how much they need to drink. Every time you consume liquid you can easily add the exact amount and type of it to the app, which will immediately calculate how it affects your water balance.

The app was silently asking to be ported to a smartwatch as its main functionality — manual tracking of consumed liquid, — can obviously be realized with a wearable in an easier way than with a smartphone.

Here’s how the animation of water balance change was created initially (it was changed later):

App design

In a way, Waterbalance app for the Watch is in contradiction with one of the main guidelines published by Apple. Theoretically, watch applications are seen as extensions of existing mobile apps that can perform only a fraction of their functions.

In case of Waterbalance, however, the situation is different: because the initial app has only the most important features already, it made perfect sense to pack them all into the Watch app as well.

“It’s difficult to design applications for a device that is not on the market yet,” said Stanfy’s designer Oleg Sheremet. “You don’t have the gadget at hand to check how your drawings will look in real life. It is also a big issue for developers, who often can’t say immediately how to implement certain features.”

Here’s what Oleg has envisioned for the app:

This looks great as an animation, however the designer admits that a need may rise to change things after the Watch is out.

“It happens with iPhone apps as well. You design an app, then check it out on the actual smartphone and realize that some features are not as convenient to use as you thought,” he added.

Main challenges

The most significant difference in designing applications for iPhone and Apple Watch is that the latter doesn’t currently allow to create animations in any way except as showing frames as pictures, one after another (same as animated GIFs).

“If you want something to move, you have to work frame-by-frame,” Sheremet explains. “If it’s a looped animation, like slight motion of a button, it’s fairly easy to do. But when you need to add animation between screens, you need to think it through very thoroughly so that it looks seamless.

pic2-res

Current version of the design

“Even simple elements require quite a bit of work. An example is the ring that shows water balance: I had to create several pictures for each percentile to make filling up look smooth. Even the numbers in the center are part of the picture as this is much easier for developers.”

Another pitfall for a designer is that the Watch brings a new paradigm, to which it’s kind of difficult to switch after spending years designing iPhone applications.

“It took me a while to draw this app. It was slow and painful in the beginning, I didn’t like what I designed,” Oleg said. “Then I just put it on hold and returned to the project in a week, and then created something I’m proud of.”

Even though this first attempt at Apple Watch app took a while, Oleg is sure that normally it should take less than designing an application for iPhone. The tricky part is to break through the “paradigm block” and pay a lot of attention to details.

The post Work In Progress: How To Design an Apple Watch Application appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/work-in-progress-how-to-design-an-apple-watch-application/feed/ 0
Mobile Application UI/UX Prototyping Process https://www.intellectsoft.net/blog/mobile-application-uiux-prototyping-process/ https://www.intellectsoft.net/blog/mobile-application-uiux-prototyping-process/#respond Fri, 07 Nov 2014 08:33:59 +0000 https://stanfy.com/?p=3716 Prototyping is an important part of an iterative design process where each screen is refined until it achieves the desired level of performance and usability.

The post Mobile Application UI/UX Prototyping Process appeared first on Intellectsoft Blog.

]]>
Prototyping is an important part of an iterative design process where each screen is refined until it achieves the desired level of performance and usability. Your future application goes through a series of interesting transformations, from a simple sketch to detailed prototype and then to the final design. Incorporating some form of prototyping into the design process is a critical step in creating great apps.

When you have defined your app concept, understood the main use cases, and came up with the list of features, it is time to think about application user interface and user experience (UI/UX).

Brainstorm UI/UX session

We start with a group brainstorming session. The project team gets together with the client, gathered in one room or via hangout, and they do a series of quick sketches of the 2-3 main app screens. Our aim is to produce a simple black and white sketch that shows the basic layout of the app. They are quick to produce and allows us to quickly test broad concepts of the app interface.

The best way to conduct such brainstorming is to allow everybody to sketch his own ideas for 2 minutes, then present it to the group and discuss. Such an approach allows each participant to express his ideas freely, without pressure and influence from others.

We found that this approach is the best way to get really cool and fresh ideas for UI/UX of the future application.

Quick iterations with paper for a UI/UX prototype

As soon as you have your first paper sketches, iteratively revise and refine them. Such simple prototypes can reveal flaws in your design concepts and allows you to resolve these issues before more significant production commitments are made (such as creating a high-fidelity mockup or coding).

Don’t forget to conduct a quick user test somewhere in the middle of your discussion. Invite some of your colleagues who are not familiar with the project and ask them to perform some simple tasks.

Whiteboard, markers, stickers and paper with the printed smartphone contours – this is all you need at this stage.

UI/UX application wireframes, user flow map

These wireframes show layout and functionality but have no visual design. Such an interface prototype is close to the final application with many details and functionality and allows you to examine usability in details.

At this stage, you need to produce all the key screens of your app and carefully think of the user flow. As usual, iterate quickly and do quick user tests. Revise the prototype based on the test results.

Design prototype, visual concept

This is the final stage of the design process when you add all the details into the designs and define the visual style of the app. This design prototype looks like a final product, and it could also work like a realistic app on your smartphone.

Using such tools like Axure RP or Proto.io, you can make screens actually interact with each other like a digital app. Interactive design prototype works the best for validating UX design direction with the stakeholders.

[custom_form form=”form-inline-subscribe” topic=”Design”]

 

Read more about prototyping and design:

 

The post Mobile Application UI/UX Prototyping Process appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/mobile-application-uiux-prototyping-process/feed/ 0
User-Centered App Design: User Involvement Through the Design Process https://www.intellectsoft.net/blog/user-centered-app-design-user-involvement-through-the-design-process/ https://www.intellectsoft.net/blog/user-centered-app-design-user-involvement-through-the-design-process/#respond Fri, 07 Nov 2014 07:56:56 +0000 https://stanfy.com/?p=7345 Do you remember the hierarchy of needs proposed by Abraham Maslow?

The post User-Centered App Design: User Involvement Through the Design Process appeared first on Intellectsoft Blog.

]]>
Test early, test often.” John D. McGrecor

Do you remember the hierarchy of needs proposed by Abraham Maslow? Just like in humans, mobile application designs go through different stages of growth too. These stages of growth are the user experience hierarchy of needs proposed by Stephen Anderson. The most basic needs start at the bottom of the pyramid and it is very difficult or even impossible to meet the higher needs without satisfying the basic. The basic need in the user experience pyramid is functionality. The highest need is meaningfulness. The chasm between usable and convenient is very hard to cross. To make your application convenient to use – that works “just like the user thinks” – you need to know exactly all user’s expectations and desires. In other words, you need User-Centered Design (UCD).

A basic question in the development process of a mobile application is how to find out what users really need. However, the elicitation of this kind of information from users is usually a challenging issue. Frequently, users have difficulties in articulating their needs. For this reason it is important to practice an interactive involvement of end-users during the whole process of app development and design – from concepting to finalizing.

Let’s look how does the scenario of UCD process look like:

It is important to make user testing on the early stages of application development. If we find out some problems during testing our application in the hybrid focus group or field test (we will come back to these testing methods later), sometimes it is necessary to repeat user testing to make sure these problems are resolved. Occasionally, it makes sense to organize second hybrid focus group, if during first one you discuss significant changes in the concept of your application and then decide to implement them. Similarly you may repeat field testing as much as it is needed to be sure that users are completely satisfied with the application design.

On the early stages of the developing process, UCD practices help us to understand:

  1. What users want to do.

  2. How they want to do it.

  3. What we can do to help.

  4. How we can do that.

Before applying any kind of user testing, mobile application development company should remember the golden rules of user involvement through the design process:

  1. Know your audience. UCD relies on user involvement throughout the design process, leading to a solution that users will find useful and want to use. To achieve that, you first need to have a clear understanding of your target audience.

  2. Know what you want to know. Make a homework – do a research, draw sketches, make some drafts of your app design concepts, determine what you need to clarify.

  3. Dig into experiences. Do not request from the testing group of users out-of-the-box solutions. Your task is to scrupulously learn their experiences.

  4. Co-create the deliverables. Try not to disturb or confuse the group of users, just help them when it is needed.

  5. Observe the facts. Be critical and open-minded. It is essential to see the whole picture, not only what you want to see.

Hybrid Focus Group

Hybrid focus group is focused on asking questions and co-creation. What does application development company need to do:

  • Gather 6-8 participants

  • Organize alternate discussion and activities

  • Let people evaluate individually

  • Discuss finding as a group

  • Learn participants’ deliverables, make conclusions

  • Discuss results with the client or stakeholders

Field Test

Field test is focused on observing behavior and seeing users in contexts. What does application development company need to do:

  • Know target audience (5 representative participants will be enough to find 80% of design problems)

  • Know what it is needed to test

  • Prepare a test script to guide the tests

  • Let participants perform tasks, according to the test scripts

  • Observe where they are happy and when they get stuck somewhere

  • Make conclusions, resolve problems and finalize design

Summary

Steve Jobs said  “You‘ve got to start with the customer experience and work back toward the technology – not the other way around.” The importance of an early and on-going focus on end-users in the mobile application development and design process is widely accepted. Usability problems continue to offer a challenge to the app developers. That is why we see an increasing emphasis on the role of users in design. The aim is to gain knowledge about users’ experiences and the context of use of mobile applications so as to achieve more effective designs.

The post User-Centered App Design: User Involvement Through the Design Process appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/user-centered-app-design-user-involvement-through-the-design-process/feed/ 0
How to Conduct Quick Usability Tests for iOS and Android Applications https://www.intellectsoft.net/blog/how-to-conduct-quick-usability-tests-for-ios-and-android-applications/ https://www.intellectsoft.net/blog/how-to-conduct-quick-usability-tests-for-ios-and-android-applications/#respond Fri, 07 Nov 2014 05:24:55 +0000 https://stanfy.com/?p=3426 Learning about your customers is key to making great and successful products.

The post How to Conduct Quick Usability Tests for iOS and Android Applications appeared first on Intellectsoft Blog.

]]>
Learning about your customers is key to making great and successful products. You can choose to invest in launching an app and then discover whether it works, or learn what your customers think about the product before you invest a lot of time and money into development. I doubt anyone would select the first option, right?

The usability testing sessions have become an essential component of any mobile product we are currently working on. It gives the unique opportunity to receive feedback at the early stages of the design process, before the development has even planned. Such experiments teach us about the expectations and preferences of target users while helping us to come up with the right app design.

I would like to share with you our approach for quick and cheap usability tests for mobile applications. It works best with a small set of testers (up to 5 people) and allows you to rapidly find out about usability problems so you can fix them faster.

Preparation

  1. Bring participants who would actually use your mobile app. “The maximum benefit-cost ratio is achieved when using between three and five subjects,” wrote Jakob Nielsen. This reduces the overhead of individual tests and makes it easier to conduct them more frequently.
  2. Prepare a design prototype that you are going to test. As this is usability testing, make sure your prototype is close enough to a final product. For our tests, we usually create interactive design prototypes that work like a realistic app on the smartphone.
  3. Write down the scenario and the list of tasks. The scenario should give the user an understanding of the circumstances he is currently in. For example, “we are going to pretend that you are at a conference, and you are taking notes from the keynote presentation…” Choose tasks that are essential to your app like taking notes, buying product, using coupons, paying bills, etc. Print the task list and scenario.
  4. Put all screens you are going to test into a Google Drive Presentation – each screen on a separate page. You will use it for making notes while conducting usability tests. Find a person who will take notes. You also can try to record video of your user testing session, but we have found that it is quite hard to record details from the app screen and very time consuming to set it all up.
  5. Ensure that the room for your user tests has a comfortable place for your participants and yourself, proper lighting, and no noise or unwelcome distractions.
  6. Don’t forget to print the legally required documents, such as an NDA. Be ready to quickly explain your documents to your participants.

Conducting tests

  1. Welcome your participants and offer a short icebreaker. It is important that the user feels comfortable and behaves naturally when working with your app. Tell your participants that it’s the app that is being tested, not them, and if they can’t do something, they should know it’s not their fault.
  2. Before diving into tasks, get the user familiar with the app, tell them the scenario and ask for initial feedback on what they would expect from the app.
  3. While taking notes, focus on a few key aspects like friction points where people hesitate, do something unexpected, get something wrong or get stuck, conflicts between user expectations and your application behavior; facial expressions can be a cue into people’s true feelings about what they are seeing.
  4. Give participants one task at a time. More than this may intimidate them or be distracting. From our experience, a user feels more comfortable when he can see the task printed so he doesn’t need to remember the task while you are speaking.
  5. Do not alter the test results by providing clues, suggesting directions or by reacting to things user say or do. All feedback you give must be neutral. Do not start shaking your head or nodding :). The only time you should speak is to help the participant give an opinion, or to clarify a response.
  6. After all the tasks have been completed, gather as much information as possible. Ask for overall impressions of the app that will allow you to judge whether expectations have been met. Always ask for suggestions that may provide insights into how the app can be better.

Summarising, planning next design iteration

  1. Try to make a summary of your user test right away after the last participant has left the room. ‘
  2. Share your overall impression, and then screen by screen discuss what you have found and what possible solutions could be. Do not postpone the analysis to the next day as you definitely will forget the details and sometimes they are the key.

The post How to Conduct Quick Usability Tests for iOS and Android Applications appeared first on Intellectsoft Blog.

]]>
https://www.intellectsoft.net/blog/how-to-conduct-quick-usability-tests-for-ios-and-android-applications/feed/ 0