Skip to main content
Redhat Developers  Logo
  • Products

    Featured

    • Red Hat Enterprise Linux
      Red Hat Enterprise Linux Icon
    • Red Hat OpenShift AI
      Red Hat OpenShift AI
    • Red Hat Enterprise Linux AI
      Linux icon inside of a brain
    • Image mode for Red Hat Enterprise Linux
      RHEL image mode
    • Red Hat OpenShift
      Openshift icon
    • Red Hat Ansible Automation Platform
      Ansible icon
    • Red Hat Developer Hub
      Developer Hub
    • View All Red Hat Products
    • Linux

      • Red Hat Enterprise Linux
      • Image mode for Red Hat Enterprise Linux
      • Red Hat Universal Base Images (UBI)
    • Java runtimes & frameworks

      • JBoss Enterprise Application Platform
      • Red Hat build of OpenJDK
    • Kubernetes

      • Red Hat OpenShift
      • Microsoft Azure Red Hat OpenShift
      • Red Hat OpenShift Virtualization
      • Red Hat OpenShift Lightspeed
    • Integration & App Connectivity

      • Red Hat Build of Apache Camel
      • Red Hat Service Interconnect
      • Red Hat Connectivity Link
    • AI/ML

      • Red Hat OpenShift AI
      • Red Hat Enterprise Linux AI
    • Automation

      • Red Hat Ansible Automation Platform
      • Red Hat Ansible Lightspeed
    • Developer tools

      • Red Hat Trusted Software Supply Chain
      • Podman Desktop
      • Red Hat OpenShift Dev Spaces
    • Developer Sandbox

      Developer Sandbox
      Try Red Hat products and technologies without setup or configuration fees for 30 days with this shared Openshift and Kubernetes cluster.
    • Try at no cost
  • Technologies

    Featured

    • AI/ML
      AI/ML Icon
    • Linux
      Linux Icon
    • Kubernetes
      Cloud icon
    • Automation
      Automation Icon showing arrows moving in a circle around a gear
    • View All Technologies
    • Programming Languages & Frameworks

      • Java
      • Python
      • JavaScript
    • System Design & Architecture

      • Red Hat architecture and design patterns
      • Microservices
      • Event-Driven Architecture
      • Databases
    • Developer Productivity

      • Developer productivity
      • Developer Tools
      • GitOps
    • Secure Development & Architectures

      • Security
      • Secure coding
    • Platform Engineering

      • DevOps
      • DevSecOps
      • Ansible automation for applications and services
    • Automated Data Processing

      • AI/ML
      • Data Science
      • Apache Kafka on Kubernetes
      • View All Technologies
    • Start exploring in the Developer Sandbox for free

      sandbox graphic
      Try Red Hat's products and technologies without setup or configuration.
    • Try at no cost
  • Learn

    Featured

    • Kubernetes & Cloud Native
      Openshift icon
    • Linux
      Rhel icon
    • Automation
      Ansible cloud icon
    • Java
      Java icon
    • AI/ML
      AI/ML Icon
    • View All Learning Resources

    E-Books

    • GitOps Cookbook
    • Podman in Action
    • Kubernetes Operators
    • The Path to GitOps
    • View All E-books

    Cheat Sheets

    • Linux Commands
    • Bash Commands
    • Git
    • systemd Commands
    • View All Cheat Sheets

    Documentation

    • API Catalog
    • Product Documentation
    • Legacy Documentation
    • Red Hat Learning

      Learning image
      Boost your technical skills to expert-level with the help of interactive lessons offered by various Red Hat Learning programs.
    • Explore Red Hat Learning
  • Developer Sandbox

    Developer Sandbox

    • Access Red Hat’s products and technologies without setup or configuration, and start developing quicker than ever before with our new, no-cost sandbox environments.
    • Explore Developer Sandbox

    Featured Developer Sandbox activities

    • Get started with your Developer Sandbox
    • OpenShift virtualization and application modernization using the Developer Sandbox
    • Explore all Developer Sandbox activities

    Ready to start developing apps?

    • Try at no cost
  • Blog
  • Events
  • Videos

Improving user experience for mobile APIs using the cloud

October 31, 2016
Evan Shortiss
Related products:
Red Hat build of Node.js

Share:

    For your end users, one of the most important aspects of your API is the perceived response time --- if your mobile application takes an excessive amount of time to load data, users will get frustrated.  

    In this series of blog posts, we’ll cover three ways to approach building a RESTful API that leads to better user experience by minimizing perceived response time. These strategies include: processing requests quickly, reducing payload sizes, and eliminating requests entirely, or only downloading data that has changed. And, we’ll show you how to do each by providing sample node.js code that can be deployed ‘as is’ on Red Hat Mobile Application Platform to build a better mobile API.  

    But, before getting into each strategy, why are these important? The user interface (UI) and user experience (UX) are extremely important to the success of mobile applications.

    Effective UI and UX Design

    Mobile has driven a revolution in software penetration. Today, almost 80% of US consumers own a smartphone capable of running complex software, or "apps" as we call them. These are “business to consumer” (B2C) solutions, and because they are customer-centric, often demonstrate excellent user interface and user experience design efforts.

    Much of this design effort is focused on creating an eye-catching UI -- one that’s intuitive to use and reduces friction through a focus on UX. If friction exists, a user becomes frustrated with the application and is less likely to continue using it in the future. It is therefore essential that friction is minimised at all times.

    An excellent example of a frictionless interaction is seen in the iOS Google Maps application, and its use of Force Touch. By pressing hard on the application icon in iOS a user can easily get directions home or to work without lifting their finger. Normally this would require opening the application, entering the address (or selecting a suggestion such as “Work”), tapping “Route”, and choosing a starting location to reach the same point using Force Touch can bring you to immediately. This is demonstrated in the flow of screenshots below.

    Without Force Touch users must go through multiple screens to confirm options

    Without Force Touch users must go through multiple screens to confirm options

    Using Force Touch, users can seamlessly get directions from their current location

    Using Force Touch, users can seamlessly get directions from their current location

    Besides reducing friction, another key feature to this UI/UX design is masking loading times associated with communicating with a mobile backend as this is commonplace in mobile applications. Let's take the Facebook application for iOS as an example of effective UI/UX design. It has three stages associated with its startup:

    1. Application startup: This is the screen (splashscreen) you see immediately after tapping the application icon. It resembles the basic application theme, but is devoid of information and fine detail.
    2. Application loaded: Empty UI components appear to simulate the News Feed. These panels look like the feed, but no actual data is being rendered yet since their HTTP API needs to return data.
    3. Application content loaded: UI components are now fully loaded since data has been loaded from Facebook HTTP API.

    Facebook Loading Screens

    Facebook splashscreen and empty tiles used to mask loading phases from disk and mobile API servers, respectively

    All technology users now, including B2B users, have become accustomed to fast response times and smooth user experiences due to the recent proliferation of mobile software, so much so that research shows that if a user experiences a 10-second load time they are likely to close your application. Now you can see why the Facebook application and other mobile applications use these techniques to minimise the perceived loading times associated with each phase of application startup. Each of these phases is masking some loading time associated with the application startup; first the application data being loaded from the iOS device storage is masked using a splashscreen, then the data loading from Facebook mobile servers is masked with empty UI components that resemble their complete counterparts.

    UX and Mobile Resource Consumption

    Developing applications for mobile landscape brings even greater UX considerations to the table. Unlike desktop applications, mobile applications work with significantly more limited resources. Your design decisions need to account for battery and bandwidth usage. Nobody likes when their phone battery is empty a mere 3 hours after a charge, and they especially dislike getting a bill from their mobile carrier for data overage charges.

    Today’s consumers expect your mobile application to meet their needs quickly and efficiently, and your internal B2B users are no exception. Tech-savvy users on most devices will even check if your application is misbehaving by taking advantage of the monitoring capabilities the device offers, and will promptly let you know about the problem, and possibly uninstall the application if the situation is dire enough.

    iOS Monitors

    Data and Battery usage monitors in iOS 10

    Summary

    As demonstrated, building your RESTful API is only half the story; mobile APIs need to load data quickly since UI and UX design can only mask loading times for so long before users grow tired of waiting. We also need to account for resource consumption concerns during mobile application development. Exposing a legacy API that is not mobile friendly will result in an inferior mobile experience, typically due to large, verbose payloads, e.g SOAP XML. Utilising an mBaaS such as Red Hat Mobile Application Platform is an excellent way to create a mobile friendly RESTful API that integrates with legacy systems and achieves the goals listed at the beginning of this article, without overhauling your existing systems.

    In this blog series, I will cover techniques that can be leveraged to minimise request processing time, reduce payload size, and potentially eliminate unnecessary requests to your mobile API. Each section will contain snippets of node.js code that can be deployed as part of any application running on Red Hat Mobile Application Platform and will immediately improve user experience if used effectively.

    Last updated: October 31, 2023

    Recent Posts

    • Build container images in CI/CD with Tekton and Buildpacks

    • How to deploy OpenShift AI & Service Mesh 3 on one cluster

    • JVM tuning for Red Hat Data Grid on Red Hat OpenShift 4

    • Exploring Llama Stack with Python: Tool calling and agents

    • Enhance data security in OpenShift Data Foundation

    Red Hat Developers logo LinkedIn YouTube Twitter Facebook

    Products

    • Red Hat Enterprise Linux
    • Red Hat OpenShift
    • Red Hat Ansible Automation Platform

    Build

    • Developer Sandbox
    • Developer Tools
    • Interactive Tutorials
    • API Catalog

    Quicklinks

    • Learning Resources
    • E-books
    • Cheat Sheets
    • Blog
    • Events
    • Newsletter

    Communicate

    • About us
    • Contact sales
    • Find a partner
    • Report a website issue
    • Site Status Dashboard
    • Report a security problem

    RED HAT DEVELOPER

    Build here. Go anywhere.

    We serve the builders. The problem solvers who create careers with code.

    Join us if you’re a developer, software engineer, web designer, front-end designer, UX designer, computer scientist, architect, tester, product manager, project manager or team lead.

    Sign me up

    Red Hat legal and privacy links

    • About Red Hat
    • Jobs
    • Events
    • Locations
    • Contact Red Hat
    • Red Hat Blog
    • Inclusion at Red Hat
    • Cool Stuff Store
    • Red Hat Summit
    © 2025 Red Hat

    Red Hat legal and privacy links

    • Privacy statement
    • Terms of use
    • All policies and guidelines
    • Digital accessibility

    Report a website issue