Airship Composer

A UX/UI project

  • product design
  • UX
  • UI

The in-app message composer project gave Airship customers the ability to control their end users mobile in-app messaging experience with a composer/UI customers can use to create in-app messaging in response to a specific event or when users meet certain conditions. Customers can also design, layout, and add content to the messaging, creating a cohesive branded app experience.

Role: Product Designer

Responsibilities:

  • Research & discovery
  • Whiteboard/Design session facilitation
  • UI / UX Design
  • Usability testing
  • Front-end collaboration & implementation

Problems:

Customers needed a way to display messages in their mobile app in response to a specific event. They also wanted to be able to control the design, layout, and content easily without the help of a developer.

Goals/Outcomes:

Leveraging specific use cases such as a welcome series and services/feature opt-in campaigns we designed a mobile app message composition flow, that guides the user through a complex series of tasks and automation configuration that is easy and intuitive to our users.

The Constraints

We needed a way to front load the different types of messages that customers could choose from. This was actually a technical concern. Our mobile team was going to have to build out each combination of message style and layout as a separate template and then build it into the SDK. Design worked with product to research with customers to figure out which main styles and layouts were key. Then we designed a visual option flow that narrowed the user down to their specific template/style/layout, front loading the user decision and contraint before more granular design/brand configuration and behavior/trigger configuration.

Message Style & Template Wizard
Users are presented with visual options and a stepped/guided experience that simplifies the process of creating in-app campaigns.

Once the user has selected the style and layout they then move in to design configuration. They can adjust the design of the background, images, color, text and buttons. They can round corners, adjust the color of the dismiss, giving them granular control over the look and feel, allowing them to replicate their app, and brand design.

This gives the messaging a cohesive experience. It feels like it's native to the app, but its not, it's Airship! And it is marketers being able to orchestrate it instead of having to rely on a developer to implement this in-app functionality.

In-app Message Composer
When the design was on-point for the brand or campaign, users can then move on to triggers, behaviors and conditions that would determine if the message would display for the end user.

Customers then can move on to set up when/how an in-app message will display for their end-user. Whether or not the message displays is contextual and displayed immediately in response to user behaviors, e.g., the user opens the app a specific number of times, views a specific screen, adds an item to the cart, makes a purchase, or views a video. It allows customers to respond to their app user behaviors instantly with customizable messages, giving customers precise control of the user experience.

Success

The ability to design each specific message was a big benefit for customers. Marketers would traditionally have to rely on a developer to create branded in-app messages. This composer gave them the ability to control message style, layout, colors, typography and images, all from an easy to use interface.

Airship won major customer contracts with in-app messaging as the main driver, and was able to unlock key verticals for sales.

Check out another project: Dark Matter, a Design System