Works

Overview

Boost.ly was created to help users find and share engaging web content with social media communities quickly and simply.

The platform allows users to curate articles from the web and share them on social networks by using RSS feeds to aggregate content of interest and synchronizing it with a social media account. The app can currently be synchronized with Twitter and Facebook.

SERVICES PROVIDED
  • Discovery & Definitions
  • Brand Redesign
  • Benchmark Analysis
  • Information Architecture
  • Interaction Design
  • Visual Design

Context and challenge

Project background and description

Boost.ly is a web app that was created in the US for small businesses and individuals who want to make their social media updates more engaging. Businesses and people often lack the time to create content that is relevant and valuable for their social networks. Boost.ly intends to make the task easier by offering suggestions and options from RSS sources.

The problem

The existing platform didn’t have a solid user experience, nor an optimal design for competing with other similar services; thus, the app had only 50 registered users. One of the main features of the app – the Ripple Gauge, which measures the effectiveness of posts and publications – was being underused and misunderstood. Additionally, the platform lacked an attractive, memorable brand.

img work img work

Project goals and objectives

  • Build an MVP (minimum viable product) to test the success of the platform, and later build on that during a future phase.
  • Create an efficient user experience and a potent visual design.
  • Expose the value of the platform through design and interactions.
  • Prove the app’s power to increase engagement through the Ripple Gauge.
  • Generate an increase in the conversion rate.

Process

Discovery phase

During an initial discovery phase, we gathered information that was used to establish the platform’s audience, and their context and objectives. We received documentation from the client stating his expectations for the product in terms of behavior and appearance.

The requirements were laid out in a design brief we created as both a guide and an agreement between the client and our design studio. This brief described the project, its objectives, audience, competitors, and features at different stages, and the technology with which it should be built. This document guided all our design efforts.

img work

Brand redesign phase

Our team started the brand redesign process by doing research on the app’s direct and indirect competitors. The goal was to identify if there was a common visual language among them, so that we could better decide how to position the Boost.ly brand and set it apart from the competition.

img work

From the insights gathered during our research, we created a mood board to display some options for color palettes, fonts, shapes, and more. This board was shared with the client and his input was crucial in the decision-making process around the visual possibilities for the app.

Finally, we presented three brand proposals, from which the client selected the final version. For the new Boost.ly app brand, we prepared the necessary guidelines that would be applied throughout the visual design of the platform.

img work

img work

img work

img work

Benchmark analysis

For the app’s structural redesign, we performed further research on Boost.ly’s competitors to identify visual design and technological complexity trends. We examined the findings using a benchmark analysis graph.

This analysis helped us form a clear idea of where the development of the product was headed, and how robust it needed to be. We relied on these insights as we decided how to position the Boost.ly app in the industry.

img work

Interaction design phase

In the next stage of the process we built an app map. Our objective was to create a straightforward and intuitive information architecture.

From the functional requirements stated on the design brief, we built the wireframes and then the interactive prototype to express the user experience strategy and to display the relationship between the functional elements that were necessary to fulfill the app’s business goals.

The wireframes were revised with the client and polished. Prototypes for both the marketing website and the web app were created.

img work img work img work img work
img work img work img work

Visual design phase

Once the information architecture and the structure of the app were defined, we started to work on the visual design for the project.

The mood board that we had previously built helped us develop the visual language. We created high-resolution mockups for the key screens of both the marketing website and the web app. Once the visual style was approved by the client, we created the mockups for the remaining screens of the app. After the desktop mockups were finished, we generated designs for tablets and smartphones.

img work
img work
img work
img work
img work
img work
img work
img work

Finally, we created the style guide and the redline. These documents serve as an important guide in the front-end development phase. The team worked using best practices in order to guarantee the quality of the product and to avoid redundant redesigns in the development stage.

img work
Marketing site
img work
Shared article – Ripple Gauge
img work
Article detail
img work
Add new RSS
img work
Settings
img work
RSS Panel

Results

“The UX Department is not just end-user experience design. It is that, but it’s so much more… I was taken on a journey of self/UVP/visitor/client discovery — the methodology used, the people I worked with, the communication, process. It’s an immersive experience that delivered incredible results, and I just wouldn’t have gotten there without The UX Department.”

JAMES WIRTH – FOUNDER – BOOST.LY