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.
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.
These user flow diagrams visualize the two main journeys supported in the HayDay app prototype: booking a trail ride as a guest and submitting a request for a sunset engagement proposal. Each flow outlines app decisions, user inputs, and background processes to guide design logic and usability planning.
These user flow diagrams visualize the two main journeys supported in the HayDay app prototype: booking a trail ride as a guest and submitting a request for a sunset engagement proposal. Each flow outlines app decisions, user inputs, and background processes to guide design logic and usability planning.
Why Paper(ish) Prototyping?
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.
Photos of the reMarkable tablet displaying hand-drawn mobile screens for the HayDay app prototype. These sketches illustrate key user flows, including booking a ride and planning a proposal, and were part of the early concept development process.
Photos of the reMarkable tablet displaying hand-drawn mobile screens for the HayDay app prototype. These sketches illustrate key user flows, including booking a ride and planning a proposal, and were part of the early concept development process.
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.
Screens from the HayDay mobile app low-fidelity prototype showing the user flow for planning a proposal trail ride, including experience selection, summary form, and confirmation screen.
Screens from the HayDay mobile app low-fidelity prototype showing the user flow for planning a proposal trail ride, including experience selection, summary form, and confirmation screen.
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.
Why This Flow Matters
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.
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.
References
Interaction Design Foundation. (n.d.). Prototyping: Learn Eight Common Methods and Best Practices. https://www.interaction-design.org/literature/article/prototyping-learn-eight-common-methods-and-best-practices