The Back Story
Flud was initially created to give consumers a better way to find and share news. As a consumer facing app, it had become a serious competitor in the space, competing with category leaders like Flipboard and Pulse.
Despite establishing themselves and obtaining a user base of over 1 million people, being late to the game was hurting them and their current feature set wasn’t enough to help them reach the number one brand position.
Because of this, they realized they needed to pivot and they asked us if we could help them out. Together, we discussed the unique opportunity to move towards becoming an enterprise solution that could change the way teams and organizations share information.
After a few meetings and some candid feedback around their base direction, we established a partnership to bring Flud Enterprise to life.
"Back in 2009, when we were working on some campaign concepts for the San Diego Padres I decided to head to the local bar in Encinitas to snag a beer and help spark some more ideas. While I was there I overheard two creatives discussing various topics based around web design and decided to chime in.
During this discussion I learned that Bobby Ghoshal, one of the creatives was in the process of designing an app called Flud. A couple beers later we were discussing the vision for the future of our companies, passing ideas back and forth and eventually exchanging numbers. That was the night our relationship began."
Developing the Brand
The biggest challenge we faced during the rebrand was articulating Flud’s offerings in a way that would resonate with their core users. We defined the brands mission by explaining what Flud is and how it’s able to benefit the user. We established a verbal framework focused on the importance of Flud’s intelligent software and how Flud makes businesses smarter and more efficient. This approach provided us with a strategic framework for the launch.
Our visual approach was focused on making information sharing easy and accessible without sacrificing sophistication and visual integrity. We transitioned the brands design language from a dark, heavy environment to a light and open space that made consumption of information easier. We also redesigned the logo in an effort to make it more user friendly, aligning it with the overall direction of the brand.
We launched the new version of Flud by pushing the brand through social media. We leveraged the existing user base they had accumulated through their consumer app as a foundation to grow the audience. We followed this social push by introducing the new Flud through an introductory video, interviews, and articles with the press.
The Web App... Taking The Product Offering Further
After a successful launch, we had realized there was a flaw in the product ecosystem. Although mobile apps were gaining popularity, we knew the majority of the users would be sharing information on their desktop computer during regular work hours… not just on their phone.
After this realization and some discussions with Flud, we strategically began defining a new web based application that would compliment the mobile and tablet environment and enable users full access to Flud at any time and from any device.
Identifying the Challenges
As we set out to tackle this endeavor we developed a feature and functionality document that outlined everything we needed to address and achieve with the app as well as rough ideas on how they would function. This document was used as a base for us as we approached our user experience, visual design and technology execution. It also inspired a lot of potential offerings and features we could integrate as we roll things out in the future.
We started creating the app by developing a feature and functionality document that outlined our goals, rough ideas and top level concerns of the design. This document was used as a base throughout the entire design process – from creating the UI/UX to the visual design and development. It also inspired us to identify potential offerings and features to integrate after the rollout.
Below are a few of the key questions we asked…
- “How do we build a scalable platform that encourages reading, sharing and social connections for both personal users as well as enterprise users?”
- “How do we build a platform that leverages all of the offerings available in the mobile and tablet versions while taking advantage of the additional viewing area and functionality a personal computer provides?”
- “Company news is company news… How can we get them to leverage this tool away from work so it benefits them personally as well as professionally?”
Defining the User Experience
During the build, we spent a lot of time thinking about the users and their needs. We really wanted to define and execute a solution that would benefit both enterprise users as well as personal users. To do this, we needed to outline what was important to them as a consumer as well as a professional.
Through numerous discovery, sketch, wireframe and user scenario sessions, we came up with an architectural framework that could allow users to easily navigate between their news streams and share important information with the click of a button. We also found ways to encourage discovery and enhance the management of their new streams and sources.
Here are a few things we identified from our discovery sessions...
We identified that discovery will play a pivotal role in enhancing the experience. By providing users with a central stream of content and a contextual side navigation, they would be able to view, experience and share various pieces of information that is relevant and may be of interest based on their viewing habits.
Being that the offering was transitioning from a consumer focused app to an enterprise solution, we realized most users wouldn’t initially be connected to a company stream. By providing a great experience for both user types, we felt adoption and usage would be substantially higher resulting in a more successful product.
Make it Social
Social sharing and users influence over the network was the core differentiator behind the consumer version of Flud. We took this core feature and pushed the app further by making it easier to share information within both the proprietary network as well as social
Visual Design & Execution
As part of our brand-wide design overhaul, we pushed Flud in a minimalist direction moving away from a somewhat skeuomorphic design, towards a more “flat” and less distracting user experience.
“BASIC didn’t cut any corners. I know they didn’t because I was right there with them during team brainstorming sessions at 2AM when they were pulling all-nighters to perfect things. Agencies don’t have to do any of that and that’s what won BASIC our AOR contract. This team is special.”
Because we are dealing with a text based offering where information presentation is key… we worked really hard to define visual hierarchy within the design. From exploration of various font weights, sizes, tracking and leading – we created an outcome that allows the user to easily scan news content in an efficient manner.
We found ourselves referencing online and offline news sources such as blogs, newspapers and books. A key thing we encountered was that when a person is browsing news stories or informative content, it’s easier to consume the information when the text is presented in an “inline” manner - with the image kicked over to the right. Thus, we implemented it into our design.
To add a bit of polish to the visual design, our designers and dev team looked for ways to implement subtle motion and interactions into the application. Throughout the Flud web app, users will notice little details such as the header bar minimizing as users scroll, transitions between environments with content fading and sliding in a very smooth and light manner - giving the site a polished and intuitive browsing experience.
We really wanted to focus on the social aspect of the network because it would provide us with two key benefits... The first being that we could grow the Flud community by establishing more user-to-user connections. Secondly, we could build upon the enterprise offerings with the idea of teams and groups connecting through shared content.
We also wanted to develop and build upon the idea of the Flud IQ, which gives every user a rating and an identity within the network. The Flud IQ measures the amount of influence you have within the network, thus giving you more credibility as an influencer and thought leader. The goal behind this is to encourage more peer-to-peer connections while introducing gamification to engage users by challenging them to increase their score on a daily basis.
The entire Flud network was developed in-house at BASIC by the Flud product team. The development team not only created an enterprise solution by curating, collecting and sharing capabilities, but also developed its own analytic framework and social network. This framework spans across mobile, tablet and desktop devices and collects and presents information for organizations to learn more about their employees.
To enhance the enterprise solution, the development team created a management portal where administrators can view various data-sets, ranging from statistics such as - who is reading what, where their source is back-linking from as well as browsing activity, all on a day-to-day basis. They also implemented a content curation system where stories, push notifications, groups and feeds can be created and managed from one central location.