BIBLE GATEWAY

Mobile App
Accsessability
Large Scale

Revamping the Bible Gateway app with a clean, contemporary design and intuitive user experience. Transforming intricate tools and features into a smooth, straightforward journey that makes reading, searching, and studying Scripture easier than ever.

Reimagining Bible Gateway for the Modern Reader

Over the course of a year, I served as the primary designer on a full-scale redesign of the Bible Gateway app and web experience, partnering closely with HarperCollins and the Bible Gateway team. Under the direction of Alex Wierda (Design Director) and with Samantha Robinson as Project Manager, we focused on addressing key user pain points from the legacy design. From concept to production, I collaborated directly with developers to ensure a smooth handoff and implementation. The entire design process was executed in Figma, resulting in a modern, streamlined experience grounded in user needs.

Problem Identifier

We began the project by identifying core usability issues in the existing Bible Gateway experience. Through user feedback, analytics, and stakeholder input, we uncovered major pain points including outdated navigation patterns, cluttered UI, and difficulty accessing key features like reading plans, search, and study tools.

  • Usability identification
  • Feedback analysis
  • Identigiy client pain points
  • Understanding the navigation

Design & Prototype Testing

With clear problem areas defined, we moved into designing modern, user-centric interfaces using Figma. I led the creation of low- to high-fidelity prototypes for both web and mobile, focusing on simplifying user flows and improving accessibility. We conducted multiple rounds of user testing, gathering feedback to validate design decisions and refine interactions, ensuring the experience felt intuitive and responsive across platforms.

  • Design iterations
  • Prototyes
  • User flows functions
  • Interaction designs
  • Highly responsive experiance

Design System & Production

Once the core experiences were validated, we built a scalable design system to ensure consistency across the app and web platforms. I worked closely with developers to translate the final designs into production-ready assets, providing detailed specs, components, and responsive behaviors directly through Figma. This collaboration helped streamline implementation and ensured visual and functional consistency across the entire product ecosystem.

  • Consistent design systems  
  • App & Web platforms
  • Developer relationship
  • Collaberation
  • Final handoffs

Uncovering the Gaps: Identifying What Wasn’t Working

We kicked off the project with a full audit of the existing Bible Gateway app and website, identifying key usability issues through user feedback, app reviews, and stakeholder input. Common pain points included outdated navigation, visual clutter, and difficulty accessing core features like search and reading plans. This discovery phase aligned the team around clear priorities and set the foundation for a focused, user-centered redesign.

Home Page

Users found the homepage overwhelming and cluttered, with too many competing elements and no clear entry point into the experience.

Bible Passages

The core reading experience felt outdated and lacked readability, with inconsistent typography and limited customization options.

Explore & Content Pages

Discovery tools and secondary content were buried under confusing menus, making it difficult for users to find devotionals, reading plans, and study resources.

Refining Wireframes

In this phase, we took initial low-fidelity wireframes and refined them based on feedback and user goals. We focused on layout clarity, navigation flow, and ensuring the content structure aligned with the app’s primary purpose.

Interactions Flows

Mapping out key user journeys to ensure that navigation felt intuitive and efficient. By testing and iterating on these flows, we reduced friction in tasks like finding passages, switching translations, and exploring content.

Design Exploration

In this phase, we explored visual styles, typography, color, and layout patterns that balanced readability with modern aesthetics. We referenced other media and spiritual apps for inspiration while aligning everything to the Bible Gateway brand to ensure familiarity and trust.

Dynamic Dark Mode

We designed a fully dynamic dark mode to enhance readability in low-light environments and reduce eye strain. Careful attention was given to contrast, color shifts, and maintaining a warm, inviting tone throughout the interface to preserve the app's comforting feel.

Designing for a Diverse User Base

Working on a faith-based app meant designing for users across a wide range of ages, tech comfort levels, and spiritual practices. I learned how to create inclusive, accessible experiences that resonate with both seasoned Bible readers and first-time users.

Balancing Tradition with Modern UX

It was crucial to honor the sacredness of Scripture while introducing modern UI patterns. This taught me how to thoughtfully modernize a legacy product without alienating its loyal user base.

Leading with User Feedback

User testing and feedback were essential in guiding design decisions. I learned how to listen closely, synthesize qualitative input, and prioritize changes that would make the biggest impact on real-world usability.

Building Collaborative

Working side-by-side with developers, I gained a deeper understanding of how to prepare clean, functional Figma files and communicate design intent clearly—ensuring a smooth transition from design to production.

Creating a Scalable Design System

I helped establish a flexible design system that could scale across both app and web platforms. This experience strengthened my systems thinking and attention to visual consistency.

Long-Term Product Thinking

Over the course of a year-long project, I learned to pace design decisions, anticipate downstream needs, and think beyond launch—designing with sustainability and future iterations in mind.

Challenge

Redesigning a product as established and widely used as Bible Gateway came with unique challenges. One of the biggest was balancing legacy expectations with modern usability—many users were deeply familiar with the old interface, so changes had to feel intuitive without being disruptive. Coordinating with multiple teams across HarperCollins, developers, and stakeholders also required clear communication and flexibility as priorities evolved.

Solution

Addressing the challenges of redesigning an established product like Bible Gateway required a thoughtful approach to ensure that legacy users felt comfortable with the changes while still embracing modern functionality. The solution lay in a careful balance between maintaining familiar elements and introducing new features in a way that was both intuitive and unobtrusive.

Reflection

Looking back on the redesign process, several key insights emerged that shaped both the development and the outcome of the project. One of the most significant takeaways was the importance of understanding the deep connection users have with an established product. With Bible Gateway, many users had grown accustomed to the old interface, so making changes wasn't just about functionality it was about respect for the history and familiarity that users cherished.