Last time, I shared the start of a new adventureโdesigning HayDay, a mobile companion app for Red Buffalo Ranch. I began with curiosity, sticky notes, and an evolving sitemap meant to bridge the ranchโs rustic magic with a digital-first experience. In that post, I mapped out the big picture, the sitemap structure, and early user flows that would support everything from booking a trail ride to planning the ultimate engagement proposal.
This week, things got real. But not in a pixel-perfect way. I went semi-old school: no polished UI kits, no high-fidelity mockups. Instead, I turned to my reMarkable Pro, one tool that let me hand-draw each screen with purpose, clarity, and just the right amount of roughness. The result? A tactile, sketched-out app experience that still lives in the digital world but captures the loose, iterative magic of paper.
Let me show you how sketching helped shape the HayDay experience, and how every screen (even the hand-drawn ones) keeps the user in the reins.
Exploring pen tools and color options on the reMarkable tablet while reviewing annotated content.
Back in the Saddle: Revisiting My Appโs Foundation
If you remember from my first blog, I built HayDay around four big, clear buckets:
Book a Trail Ride
Manage a Reservation
Engagement Proposals
Explore the Ranch & Earn Rewards
That structure originated directly from my sitemap, the blueprint that gave HayDay a clean, focused information architecture. But a sitemap alone doesnโt tell the whole story. So, I followed up with user flows, which are little journeys that show how someone would move through the app, screen by screen, action by action.
I talked about these flows last time, but theyโve grown since then. Like a rough trail that becomes more defined with every ride, my flows matured into clear sequences. Thatโs when I knew it was time to test them out by drawing them out.
Paper prototyping is one of those UX techniques that sounds almost too simple to be effective. I sketch my screens and walk users through the experienceโno code, no software polish, just flow and function.
In my case, I didnโt use literal paper, but instead turned to my reMarkable Pro for freehand sketching. From there, I used Adobe Photoshop to separate and refine each drawing, adjusting contrast and layout to keep things clear. Finally, I assembled everything in PowerPoint to create a presentation that showcases the user interactions and flow, which I exported as a PDF for easy viewing.
This hybrid approach gave me room to explore and refine without getting too precious about the details. It lets the ideas lead, not the tools.
As the Interaction Design Foundation notes, โPaper prototypes are useful early in the design process when teams are working to figure out the structure of an interface or workflow.โ
From Flows to Frames: Sketching the HayDay Experience
With the sitemap and information architecture (IA) set, I began mapping out the app’s functionality through two core flows that reflect common and exciting user scenarios at Red Buffalo Ranch. Each screen was sketched to explore layout, pacing, and ease of use.
Flow One: Planning a Proposal Ride at Sunset
This first flow focuses on something magicalโan engagement proposal on horseback, timed perfectly for sunset. Starting from the home screen, the user selects the โProposalsโ option, then explores the available experiences such as โSunset Trailsโ and โBabbling Brooke.โ Once โSunset Trailsโ is selected, the app guides the user to a date and time picker.
After selecting the perfect evening, the user fills out a form requesting extras, such as photography, flowers, or music. I designed the form with clear input fields and checkboxes to simplify the process. Once submitted, the user receives a confirmation screen summarizing their request.
This flow was all about balanceโcreating space for excitement while reducing complexity. The form breaks down each piece of the request, and the summary screen reassures users that their special moment is in good hands.
Flow Two: Booking a Trail Ride (But Not for Today)
The second flow simulates a user opening the app to book a trail ride but choosing not to ride that same day. After a splash screen and home page, the user is presented with a pop-up asking if they would like to book a ride today. In this scenario, they hit โNo thanks,โ which redirects them to a calendar view.
From there, they select a future date, choose between a 1-hour or 2-hour ride, and are prompted to log in or continue as a guest. I wanted to ensure the guest path was transparent and frictionless, ideal for someone booking at the last minute or casually exploring.
I intentionally split the process into digestible steps: ride type, rider details, and payment. It mirrors real-world decision-making and avoids overwhelming users with an excessive number of choices at once.
Every screen in both flows was designed with clarity and intentionality in mind. Form fields, buttons, and even confirmation screens are laid out to feel as thoughtful as they are functional. Green buttons signal action. Yellow highlights input fields. Recurring icons across the bottom navigation bar reinforce the structure: Home, Bookings, Rewards, and Account.
That consistency creates confidence, and confidence makes people more likely to complete their booking or proposal request.
Where Itโs Headed Next
This round of prototyping helped me pressure-test ideas before committing to final visuals. With both flows mapped out in low-fidelity form, the next step is user testing. Iโll invite testers to explore both paths independently, without prompting, to engage in honest interaction and determine what makes sense, what doesnโt, and where the design can evolve.
Powered By EmbedPress
Come Back for the Next Ride
In the next phase, Iโll gather feedback, refine the flows, and prep the high-fidelity wireframes. The goal? A beautiful, intuitive app experience that still feels like Red Buffalo Ranchโcharming, personal, and easy to navigate.
Until then, thanks for riding along. If you’re sketching your ideas, keep goingโsometimes the best journeys start with a few rough lines and a strong sense of direction.
Have you ever tried to plan a peaceful trail rideโฆ and ended up tangled in digital tumbleweed?
That was my experience the first time I booked at Red Buffalo Ranch. The ride was unforgettable, sunlight filtering through Evansburg State Park, the gentle sway of a well-trained horse, and that rare feeling of pure stillness. But getting there? A clunky website, an email form, and a follow-up call that took days. That contrast, between natureโs simplicity and the digital hassle, sparked the vision for HayDay, a conceptual mobile app that transforms how riders connect with the ranch.
User flows are at the core of that transformation. These unsung heroes of UX design became the trail map guiding us from frustration to delight.
What Are User Flows?
User flows are step-by-step diagrams that chart how users move through an app to achieve a specific goal. Each flow starts with a userโs intent, like booking a trail ride, and follows every decision point, screen, and interaction required to make that happen.
Think of a user flow like a trail map for the app experience: where you begin, where you might stop, and the most straightforward route to the destination. It helps designers, developers, and stakeholders focus on what the user needs at each step, not just what looks pretty.
This is an image showcasing a sketched visual user flow that maps out the step-by-step navigation between key mobile screens like Home, Search, Product, and Profile during the early stages of app design.
Why Are User Flows Essential?
User flows keep your team honest. They ensure your features are purposeful, your screens arenโt bloated, and your users donโt hit dead ends. Without them, youโre designing blind.
Hereโs why they mattered so much for HayDay:
Clarity for Users: We designed each flow to feel natural, even delightful, especially for users unfamiliar with mobile booking.
Efficiency for the Business: Fewer back-and-forth emails and phone calls mean more time for Red Buffalo staff to focus on guests, not logistics.
Empathy in Action: The flows let us walk in our users’ boots, whether local families, event planners, or spontaneous weekend adventurers.
Bringing the HayDay App to Life
The HayDay app is all about making the magic of Red Buffalo Ranch more accessible, intuitive, and enjoyable from the very first tap. Users can explore, book, and personalize their experiences in one place without emailing for availability or waiting days for a call.
The appโs key features include:
Trail ride booking with real-time availability
My Reservations dashboard for edits/cancellations
Event & group ride inquiry forms (proposals, birthdays, scout rides)
In-app payments with Apple Pay and credit cards
Seamless waiver + confirmation handling
Letโs dig into the user flows that made this happen.
User Flow 1: Booking a Trail Ride
Lisa’s User Story:
As a first-time visitor, I want to browse trail ride options and reserve a ride from my phone, so I donโt have to call or wait for a reply.
Scenario:
Lisa, a 34-year-old marketing manager from Philadelphia, wants to plan a spontaneous Saturday adventure with friends. She downloads HayDay, taps โBook a Ride,โ filters by date and group size, checks the availability calendar, and books a 1-hour ride in minutes. She pays with Apple Pay and gets an immediate confirmation and waiver to e-sign.
This user flow illustrates how a first-time visitor like Lisa can browse, select, and book a trail ride seamlessly using the HayDay app.
Flow Highlights:
Clear categories (Beginner, Intermediate, Scenic)
Real-time scheduling calendar
Instant confirmation = instant confidence
This flow tackled Lisaโs most significant pain point: waiting. She never had to leave the app or her couch.
User Flow 2: Viewing and Managing Reservations
Brian’s User Story:
As a returning customer, I want to check my upcoming rides and make changes, so I can stay flexible without contacting the ranch directly.
Scenario:
Brian, a father of two, has a family ride scheduled but just found out his sonโs soccer practice was moved. He opens the app, finds his booking in โMy Reservations,โ and reschedules for the next day with just a few taps, so no rebooking is needed.
This flow shows how returning user Brian edits or reschedules an existing reservation directly within the HayDay app without contacting the ranch.
Flow Highlights:
Persistent navigation makes โMy Reservationsโ easy to find
Edit, reschedule, or cancel without penalties
Intelligent alerts remind users of waiver completion and arrival times
This flow was built for flexibility, life happens, and the app needed to adapt.
User Flow 3: Submitting a Proposal Inquiry
Emily’s User Story:
As someone planning a proposal, I want to explore private ride packages and request more information, so I can plan something personal and unforgettable.
Scenario:
Emily, a veterinary student, dreams of proposing on horseback at sunset. She taps into the โSpecial Ridesโ section, finds the proposal package with beautiful imagery and testimonials, and submits a quick inquiry form. The next day, she receives a friendly call to plan the details.
This user flow captures Emilyโs journey through the app as she explores private ride options and submits an inquiry to plan a memorable proposal.
Flow Highlights:
Inspiring content with emotional storytelling
Simple, low-friction interest form
Backend automation sends her info to the right ranch contact immediately
This flow prioritizes connection over automation; itโs personal, just like the moment Emilyโs planning.
Want to see the full user flows in action?
Download the HayDay User Flows PDF to explore detailed visuals, user scenarios, and feature breakdowns that guided the mobile app concept from spark to storyboard. Whether youโre a fellow UX designer, a nature-loving planner, or just curious how digital journeys are mapped, this doc walks you through every thoughtful step, story, and scenario.
Powered By EmbedPress
What I Learned
Designing HayDay through user flows revealed something essential: even the most magical destinations can be derailed by a poor digital experience. My job as a UX designer isnโt just to make things look nice; itโs to remove the friction between a userโs intention and experience.
Every flow I created for HayDay started with listening. I held interviews, ran usability tests, and read through feedback from real Red Buffalo Ranch guests. That empathy shaped the wireframes, the buttons, the notifications, everything.
Hereโs the truth: when a rider opens an app to book a trail ride, theyโre already picturing the trees, the horses, and the moment. My job is to get them there with ease, joy, and no confusion.
Final Thoughts
HayDay may be a concept for now, but the approach behind it is accurate and replicable. Whether you’re designing for a ranch, a museum, or a university, the power of user flows is the same: they guide you to build for humans, not hypotheticals.
User flows helped me create a better ride, digitally and literally. And thatโs what UX is all about.
Additional Reading & Resources
While researching how to do user flows, I came across several good references. Below are two articles. The video Intro to User Flow Diagrams below is a simple and quick tutorial with an example.
In the digital age, an engaging, intuitive website is essential for businesses aiming to attract and retain customers. Red Buffalo Ranch, renowned for its picturesque horseback trail rides and lessons, recently undertook a usability study to understand how its website meets user expectations and industry standards. This article takes readers through the journey of discovering key usability issues and outlines strategic improvements that could transform the ranch’s digital presence.
The existing homepage of Red Buffalo Ranch, featuring outdated design elements, lacks engaging visuals and an intuitive navigation structure.
How the Research Unfolded
To accurately gauge user experiences, a multi-method research approach was adopted, involving competitive analysis, user interviews, surveys, diary studies, card sorting, heuristic evaluations, and direct usability tests. These methods provided both qualitative insights and quantitative data, painting a comprehensive picture of the websiteโs performance.
Competitive analysis began with examining three similar horseback riding websites. This process highlighted best practices, such as engaging visuals, streamlined online booking, and user-friendly navigation. User interviews and surveys were integral, capturing insights from a variety of potential visitors, including outdoor enthusiasts, families, and equestrians. These qualitative and quantitative methods identified consistent frustrations, notably around navigation and booking simplicity.
Diary studies further enriched this data, tracking user interactions over several weeks to reveal recurring challenges, particularly regarding mobile usability. Heuristic evaluations based on Jakob Nielsenโs usability principles exposed design inconsistencies and accessibility barriers, while a card sorting exercise refined how content should ideally be structured based on user preferences.
Insights from the card sorting exercise reveal user preferences for organizing website content, highlighting areas for improved navigation.The similarity matrix showcases patterns in user categorization, guiding the restructuring of the site’s information architecture.
Uncovering Core Usability Issues
A significant issue identified was the websiteโs lack of engaging visuals. Current imagery did little to showcase the beauty, excitement, and immersive experience of horseback riding at Red Buffalo Ranch. Competitor websites effectively utilized professional-grade photographs and dynamic video content, leaving the ranch’s static visuals underwhelming in comparison.
Navigation posed another substantial problem. Users frequently faced difficulties locating essential information such as pricing, details about trail rides, and booking instructions. This was largely due to an overly cluttered layout and text-heavy pages. The absence of intuitive navigation elements, such as dropdown menus or clearly labeled categories, further complicated user journeys, often resulting in frustration and reduced engagement.
Arguably the most critical obstacle uncovered was the lack of an integrated online booking system. Users were forced into cumbersome interactions, needing to call or email to reserve ridesโmethods seen as outdated compared to competitor standards. Mobile usability was another major drawback. Users consistently reported slow loading speeds and poor formatting, making navigation cumbersome on mobile devices. The visual examples included below clearly illustrate the minimal difference between desktop and mobile views, highlighting the websiteโs lack of responsive design.
The desktop version of the website displays a cluttered layout with text-heavy pages, leading to user frustration.On mobile devices, the website maintains the same outdated visuals and lacks responsive design, making navigation difficult and highlighting the urgent need for mobile optimization.
Recommendations for Transformative UX Improvements
The usability report led to actionable recommendations designed to significantly enhance the user experience:
To immediately enhance usability, the siteโs navigation needs restructuring. Dropdown menus should clearly separate sections such as โTrail Rides,โ โLessons,โ and โFAQs,โ making key information accessible within minimal clicks. A search function would also significantly aid users in quickly locating specific details.
Integrated Online Booking System: This would allow instant reservations with automatic confirmations, simplifying user interactions and reducing friction.
Mobile Optimization: Ensuring responsive design is crucial, given the substantial mobile user base. Improved mobile layouts, quicker loading speeds, and enhanced readability will boost overall satisfaction.
Enhanced Visual Storytelling: Professional, high-resolution images and videos should replace the existing static visuals, showcasing the picturesque trails and authentic ranch experiences to captivate visitors.
Clearer Content Formatting: Information should be presented in digestible formats, such as bullet points, concise headings, and visual hierarchies, aiding quick and easy scanning.
Strong Branding Integration: Consistent use of the ranchโs colors (red, black, white) throughout the site, prominent logo placement, and cohesive storytelling elements will strengthen the brand identity and appeal.
The low-fidelity desktop redesign introduces simplified navigation and updated visual elements, prioritizing user-friendly access to essential information.The mobile-responsive prototype showcases optimized layouts and streamlined navigation, ensuring seamless interactions across all screen sizes.
Enhancing Content with Multimedia
While direct footage from usability testing isn’t available, multimedia content significantly enriches the user experience. Incorporating engaging videos, such as the promotional material available on Vimeo (Red Buffalo Ranch Promotional Video), can vividly showcase the unique experiences Red Buffalo Ranch offers. This professionally produced video highlights serene trail rides, joyful rider interactions, scenic landscapes, and captures the essence of family-friendly adventures that visitors can anticipate. Integrating such multimedia effectively bridges the gap between digital browsing and the actual ranch experience, encouraging visitors to explore further and easily envision their own visit.
This video introduces viewers to Red Buffalo Ranch, highlighting popular services and experiences available to visitors.
The Value of UX Research
By adopting the proposed recommendations, Red Buffalo Ranch can dramatically enhance its website, creating an online experience as enjoyable as its real-life horseback adventures. This research underscores the value of UX, proving that user-focused improvements are not just beneficialโthey’re essential.
Ultimately, usability research provides a strategic roadmap for bridging the gap between user expectations and business goals. Prioritizing clear navigation, engaging visuals, and convenient functionalities ensures the website will not only attract visitors but also encourage them to stay, explore, and book their next adventure with ease.
For readers seeking deeper insights into the methodologies, findings, and complete recommendations, the full usability report is available here.