Petra Agency has helped Probi create a new website that caters to both visitors and editors' needs. This generates more prospects, leads and partners while making work less time-consuming and more enjoyable for editors.

Probi develops, produces and delivers clinically proven probiotics that improve human health. The international company was founded at Lund University in Sweden in 1991 and has since expanded its presence to more than 40 markets and been granted more than 400 patents.

In the early spring of 2020, Probi initiated a review and update of its communication concept, messaging platform and visual identity. The company was using a less-than-optimal web platform: editors found it overly complex, making regular updates both time-consuming and difficult for them to carry out.

Petra Agency was invited to present options for a new CMS (content management system) that would provide user-friendliness, flexibility, a vast range of features and a great editing experience.

A joint prestudy and workshop were conducted, in which important considerations were discussed and investigated. Examples of topics include web visitor needs, customer journeys, website objectives and digital goals, basic site structure and competitive benchmarks.

After the workshop, Petra developed a basic design proposal and suggested a few different CMSs. Probi accepted the design proposal and chose to go for Umbraco CMS.

Challenges

The previous CMS's bad editor experience led the Probi web editor team to emphasize the importance of the back-end environment being easy to learn and use. Hence, the functions for populating content, making updates and editing needed to be built to allow for very smooth workflows.

An equally important requirement was to create a front-end experience that tells the Probi story, explains what Probi is about and highlights its mission to improve human health based on its cornerstones Innovation, Science, Performance and Passion. The front-end experience also has to be engaging and drive qualitative visitors to become prospects, leads and partners.

For Probi, it was essential that the new website would cater to the challenges and needs of several prioritized personas across different segments. The goal was to make all personas feel understood (heard and seen) and convey a sense of Probi being an easily approachable partner.

Probi is active in a global market consisting of both big and small players. Since Probi has limited resources, the website must help increase the company's reach. Therefore, the website should specifically target the early steps in the customer journey, focusing on creating awareness.

Design idea

Essential for the project was to translate the existing graphical guidelines into a unique and distinct digital platform. A light and comfortable expression paired with imagery focused on people and warmth help spark feelings of well-being, just as Probi's products aim to do.

Technical solution and implementation

Probi's new website is built on the Umbraco platform. Umbraco is an open-source product based on Microsoft's .NET platform, making it very cost-efficient and secure. Probi also decided to utilize Umbraco's cloud hosting option, which comes with advantages such as automated upgrades and very smooth deployments. And there's no need to worry about security certificates since https is included in the Umbraco Latch service.

The project was run using Agile and Scrum development methods and broken down into a number of sprints. It is easy to adapt this process to the client's desired degree of project participation. If the client wishes, it can be very closely involved in the development process and join the daily stand-ups. The client can also decide to focus less on the daily stuff and instead put more effort into sprint plans, prioritizations, requirements and demos of developed code.

Since Probi's website focuses on creating awareness, trust, and a sense of approachability, content and messaging are paramount. And to create a credible user experience, the design idea needs to correspond to and support both the communication platform and brand.

Individual components have to be easy to use and re-use on various page templates and in different scenarios to avoid an overly complex back-end environment. The components also have to be both adjustable and easy to work with for non-technical web editors. This was all facilitated by using an approach where content could be stored in separate "items," making it very easy to re-use content across multiple pages. The back-end environment was organized in two main sections to support this approach: the Site Structure Section (the tree structure that corresponds to the sitemap), housing the various page templates; and the Content Section, housing all the various content components.

An important technical feature is Cision integration. Using Cision's IR and Newsfeed modules, Probi can provide website visitors with up-to-date and push-based information.

Result

The final website excellently reflects the initial ambition of creating a website where both the visitor and editor are in focus. The front-end experience is catering to the prioritized personas' needs, making it very easy to navigate and find information. The back end is structured and straightforward for website editors, following the logic provided by its two main sections.