Benefits Destination

Create, duplicate, templatize, and personalized employee benefit websites that serve as a valuable resource for educating and guiding users during their online enrollment process and throughout the year. Allows for flexibility at the desired speed, efficiently meeting clients' needs.

Role
Lead UX/UI Designer
Service
Web & Software
Client
Optavise
Benefits Destination Project main image
[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object],[object Object],[object Object]

My Role

An Origin Story

Upon acquiring WBD and Direct Path, CNO established Optavise.

As the company's first ever designer for this venture, I was fortunate enough to lead the project with the support of an exceptional team. Comprised of three front-end developers, one back-end developer, and a product owner, we worked together to ensure the success of this application.

My role entailed everything from information gathering, user mapping, data architecture, wireframes, prototyping, visuals, and assits front-end when behind. I also helped write technical specifications, user guides, testing and training plans.

The Challenge

Decoding: The Labyrinth of Wishes and Needs

Following the merger, it became evident that the company needed an autonomous and self-contained application to reduce reliance on external tools like Adobe's XD, Dreamweaver, and Ceros.

I needed to ensure a user-friendly interface that allowed non-technical users to effortlessly create, select, or modify custom website elements while allowing for manual styling for customization, which would require the user to know a little something about design layout.

Also, in addition to the fundamental objective of cost reduction and system maintenance, the company had specific requirements not met by any previously used applications. This project drastically affected multiple areas of the organization, which sometimes had conflicting interests.

Initially, this project had a timeline of six months, which we knew would not be enough time for what was being requested. After presenting the findings, the stakeholders agreed to extend the project by an additional six months.

High-level Requirements:

  • Make it fast and easy to create, edit, and publish.
  • Give users control over new and existing designs.
  • Make it accessible
  • Offer translation options
  • Employee role-based access control
Benefits Destination Project Image
Benefits Destination Project Image
Benefits Destination Project Image
Benefits Destination Project Image
Benefits Destination Project Image

These images are demo employers not actual employer benefit sites.

Kickoff

Tiny Deliverables, Big Needs: The Quest for Clarity

When we initiated the project, our mission and goals weren't crystal clear. Taking the lead, I engaged with stakeholders and conducted qualitative and quantitative research. We organized several focused group sessions to investigate user behaviors, experiences, preferences, and challenges. The primary objective was collaborative: to gain a comprehensive understanding.

Having meaningful and thought-provoking discussions with these focus groups was incredibly valuable. It helped me better prepare and inspired me to ask more refined questions. This back-and-forth process gave me a comprehensive understanding of our users, which better prepared me when it came time to start thinking about possible concepts and wireframing.

Key Takeaways:

  • Confusing. The systems were scary and difficult to understand
  • Responsive. Sites were not mobile responsive
  • Translation. A whole new site needed to be created for multilingual communication
  • Multilevel Navigation. Top-level categories to sub-menus were unbuildable
  • Customization. No options for layout templates and custom builds
  • Real Site. The Ceros site were in a presentation style
Mockups

The Discovery

App Alchemy: Crafting One App to Rule Them All!

I braced myself for a rollercoaster ride as I embarked on this adventure. In the middle of a merger whirlwind, a race against the clock, users with wish lists from different galaxies, and a brand new project manager joining the chaos midway. But backing down wasn't in my playbook. We needed to build a dynamic front-end application allowing users to create and see changes on the fly. My mission remained firm: creating a streamlined workflow for an app that anyone could handle with little guidance; meanwhile, the pros could still dive into all the advanced features. But I am a realist and knew users would need some concepts and knowledge of design and layout- so how do I tackle this challenge?

I researched and focused on users' typical setups and issues within their current systems. I explored content management systems (CMS) workflows and popular design editors. Remembering my struggles with WordPress back in the day, I meticulously refined my designs until they clicked perfectly with users.

Amidst the whirlwind of changing business strategies and varying stakeholder preferences, I had to keep my mind and goals straight and focused on staying on track through the shifts and turns. Ultimately, I arrived at a solution that empowered users to create, choose, edit, and save templates for entire sites and individual pages. I introduced the idea of adding widgets, pre-designed styled elements ready to be effortlessly placed into pages, alongside a range of customization options. These choices harmonized well, providing the ease of plug-and-play applications while striking the right balance between simplicity for non-designers and flexibility for intricate customization.

generated image of some screens from the benefits destination app

The Solution

Embracing Imperfection: Focusing on Improvement and Priorities

As the benefits destination application nears its beta phase, we have minimally needed to change the application's layout and workflow. Allowing the design to evolve through the user's hands during the design phase, providing a comprehensive user guide, and organized training sessions boosted user success. It helped users learn, be open to offering feedback early on, and better navigate the application once it was available in a playground environment.

Just a few of the many options available

  • Roles and permissions
  • Salesforce CRM integration
  • A cloud-based library system for multiple services
  • Translation services
  • Light and Dark mode
  • Custom Configuration
  • Widgets - add from the library, customize, or create your own
  • Multi-menu navigation possibilities
  • System validation before client review

Since we adopt an agile process altering, realigning goals, and tweaking priorities is just part of the daily grind. Still, throughout the development process, our team devoted considerable effort to focusing on the needs and preferences of the target users. We adapted and refined our KPIs, organizing them effectively to concentrate on crucial metrics and setting others aside for future phases.

The benefits destination app represents the culmination of a journey marked by determination, knowledge, dedication, and passion. As we launch the beta version, we eagerly anticipate witnessing its success, ongoing growth, and significant impact.

Benefit Destination App documentation img
Benefit Destination App documentation img
Benefit Destination App documentation img

What did I learn?

The Chronicles of Challenges and Learnings

This project had a significant impact and came with some tough deadlines. While we managed to launch on time, we could have done better in some areas. We were all under a lot of pressure, and the expectations for each of us were sky-high.

Looking back, the project phases and user stories should have been more specific and broken down into smaller, more focused goals.

As the project went on, the scope expanded with new ideas and "nice-to-have" features from stakeholders that didn't match our original goals. Some of these extras made it into later stages, but others made the exception. These additions put more pressure on the team to deliver work that wasn't fully fleshed out and didn't address the main goals we had set within the original timeline.

Because of this scope creep and the need for a better structure, we sacrificed some quality and pushed back goals we had already defined to make room for these new "nice-to-haves" that our project could have done without at that moment. This situation led to problems like system lag and issues with different elements not connecting smoothly, all of which had to be fixed before launch. It was more work for us.

But even when things don't go as planned, there are successes. In this case, I realized how crucial team communication is. Our ability to handle the heavy workload was thanks to the team's constant communication, brainstorming sessions, and solid teamwork. I got to experience the entire UX process and feel proud of the work I gave.

Look at what we can create!

Crafting the Future: Sneak Peek into Widgets and Templates!

We developed and standardized templates and widgets, streamlining the effortless plug-and-play benefit website construction process. Take a glance at some demos we crafted during our site exploration.

Benefits Destination Demo 1
Benefits Destination Demo 2
Benefits Destination Demo 3
Benefits Destination Demo 3
Benefits Destination Demo 4