A guest post from Fearless Product Designer Abbey Salvo about progressive enhancement and its place in DesignOps.
What is progressive enhancement
At its core, progressive enhancement is about starting simple. But we should not confuse simple in this context with a state that is weak or incomplete. Instead, a strong, simple beginning acts as a sound support to enable future design complexity while maintaining a user-centered focus.
The goal here is to first create this solid foundation centered around user needs. The building blocks of progressive enhancement then evolve to accommodate specific content and semantic structure, and finally allow for additional complexities like animation and visuals which enhance the experience to be more enjoyable and vibrant.
Why progressive enhancement is important
In alignment with its user-centered nature, progressive enhancement first and foremost supports accessibility and maintainability. By building a proper semantic structure that addresses the needs of users first, we build a system which provides inherent meaning; even without a beautiful interface our product becomes objectively intuitive for our users despite how they might interact with the content (visually, audibly, etc). Once we know that the core components capture this understanding, maintaining this and enhancing it becomes more straightforward.
Progressive enhancement has an added benefit of helping designers socialize user-centered design decisions and other standards with their team and stakeholders as part of the regular development process. As each decision has traceability back to the user, we create more holistic alignment as to the “why.” This can have positive impacts on things like component documentation, unit testing, and product handoff.
The divide between design and development can sometimes be significant, which requires more focus on how team members communicate and transfer information. I’m in a unique position because I participate in user research, product design, and development work at Fearless. I find that this ability to holistically capture what we know about our users and understand how that translates into the actual development of the product enables more consistency in ensuring user needs are properly addressed. It’s really helpful to have that coding perspective and be able to anticipate future development consideration, but this is not required to effectively leverage progressive enhancement. At the end of the day, each team must rely on constant communication between researchers, designers, and developers. This begins with team alignment on what progressive enhancement is, and the part each member plays in enabling this throughout the process. With care and attention, a team’s cadence in favor of progressive enhancement can allow for improved velocity and parallel work.
How Fearless successfully utilizes Progressive Enhancement
I work on the National Archives and Records Administration (NARA) Catalog team. We are improving the way NARA organizes its vast, public-facing historic dataset by providing a user-focused product with more intuitive search and contribution functionality, as well as scalability for site users.
With more than 13 billion pages of records, our team is addressing a scalability problem. The backend data structure we’re developing must be able to support growing volumes of information. Looking at this project through the lens of progressive enhancement, we started by understanding the users. Reviewing existing user research allowed us to identify gaps in that understanding, which we addressed with additional Fearless research. This helped us to identify and prioritize problems that needed to be addressed, and hypothesize on what those solutions might be. Naturally, a deep dive into the content followed.
At this point in the project, we realized we couldn’t address the backend issues and simply apply better user-centered design to front end in its current state. What existed did not feed into the idea of a solid foundation; there were critical accessibility concerns ingrained deeply in the semantic structure, and the content hierarchy did not support our users mental models.
Working with the customer and stakeholders, the Fearless team was able to bridge the gap between the current system and what would work best for future users, striking a balance between NARA business goals and requirements within the scope of our contract.
Once we had a good idea of how the product could properly support our users, we were able to confidently build flexible components to support that need. As we continue to enhance aspects of the front-end, we take care that our design informs structure, and our code supports understanding. We still have a long way to go before we will have something that is visually beautiful, but our continued journey will be much smoother as we enhance the strong foundation we have built.