Neartail - Website Builder
2024Build a real business website, not just a form link.
Mr. RYT turning travel memories into publishable stories.
The first user-facing surface of Mr. RYT turning travel memories into stories the marketing team can actually publish.
I'm Live!
Website Link
30-second overview
- This is the first user-facing surface of Mr. RYT Route Your Travel's AI travel buddy, currently marketed on the live homepage as “Coming Soon.”
- I led the end-to-end design of an AI blog generator that turns three kinds of input photos, WhatsApp chats, and prompts into one publishable blog format. Past customers and cold website visitors both use it.
- I started with a chat-first interface. It worked for engaged users and broke for cold ones so I added a second, guided form flow behind the public blog page. Two surfaces, two pacings, one unified output.
- I was the sole lead designer designed the website and led 2 intern developers through the full-stack build, kickoff to live in 27 days (Jun 29 – Jul 25, 2025). The blog generator's AI engine is built on the backend; the UI is in active development.
Overview & Context
Route Your Travel is a full-service travel agency. The next chapter is an AI travel buddy called Mr. RYT.
Route Your Travel (RYT) is a Chennai-based travel agency that books trips and builds itineraries for families, couples, friends, solo travellers, corporate teams, and one-off experiences like F1 Grand Prix packages and cruises. Their tagline on the live site sets the direction: “Hyper-Curated. Dedicated Support. Powered by Mr. RYT (Coming soon).”
I'm designing Mr. RYT's first user-facing surface a blog generator. It exists because the marketing team was the bottleneck for organic content: every customer story on the site was hand-written, which doesn't scale. The fix: invite past customers and cold visitors to drop their photos, chats, or prompts and get back something they'd actually publish.
Impact
Designed and shipped the full RYT website in 27 days, leading 2 intern developers through the full-stack build now live with five real customer blogs.
Consolidated three AI input modes (photos, WhatsApp chats, prompts) into one publishable output the unification principle the generator is built around.
Designed two parallel entry flows (chat + guided form) feeding a single AI engine split by user fluency, not by feature.
AI backend built; generator frontend in active development. Internal itinerary builder shipped to RYT team in parallel.
Problem
The trip ends. The story never gets told.
Imagine you just got back from a trip RYT planned.
You spent ten days driving through Sri Lanka with your family. Your phone has 600 photos. Your WhatsApp group chat has hundreds of messages inside jokes, moments, the small disasters that became the funny parts.
You'd happily share the story. RYT's marketing team would happily publish it. But sitting down to write a blog post feels like homework you didn't sign up for. So the photos stay in the camera roll, and the story stays in the chat.
This is what happens after almost every trip. The signal is there. The system to turn it into content isn't.
For the marketing team, this meant a slow, manual content pipeline. Every published blog on the site travelled through the same handoffs, every single time:
1
Reach out.
The team contacts a recent customer asking for a write-up.
2
Wait.
The customer agrees, then doesn't get to it for weeks. Most don't reply.
3
Ghost-write.
When content is needed, someone on the team writes it from scratch using customer interview notes.
4
Format.
Paste into the CMS, source cover photos, fix layout to match the existing blog page.
5
Ship.
One blog every few weeks. Not a content engine.
My Note
At first, it looks like a writing problem customers don't write blogs. It's actually an input problem. They have photos, chats, and a story in their head just no easy way to hand it over.
Vision
Mr. RYT says: show me your trip in any form. I'll hand you back a blog.
Mr. RYT is positioned on the homepage as Route Your Travel's coming-soon AI travel buddy eventually planning trips, suggesting itineraries, augmenting (not replacing) the agency's human planners. The blog generator is the first surface shipping under that banner: a way for past customers and cold visitors to convert raw memory into publishable text.
“What if a customer didn't have to write a single sentence and still ended up with a blog they'd be willing to publish under their own name?”
From a product perspective: the generator ingests three input modes photos (with EXIF location and visual vibe extraction), WhatsApp chats (extracting characters, timeline, tone markers), and prompts (free-form text plus optional mood tags) runs them through Mr. RYT's AI engine, and returns one consistent publishable blog. Same template, same author card, same Publish action, regardless of input.
Challenge
Two audiences. One AI engine. Very different mental models.
The generator needed to work for two groups of people with almost nothing in common:
- Past RYT customers already engaged with the brand, comfortable being asked to share stories, often AI-fluent (they've used ChatGPT, they know what to type). They want the fastest path: drop the photos, get a blog.
- Cold website visitors found RYT through search, never bought anything, scrolling the public blog page. Less AI-fluent. They need the system to show them what's being asked of them, step by step, before they commit to typing anything.
Both groups had to land in the same place a publishable blog inside RYT's existing visual system, ready for the marketing team to curate. The constraint was real: any blog the generator produces has to slot into the same blog page where the five hand-written customer stories already live, without retrofitting.
The constraint that shaped everything
One AI engine, one publish destination, one visual system but two completely different audiences arriving with different expectations. The flows had to diverge at the entry, not at the output.
Input → Output
Three input modes. One publishable blog.
The generator takes three kinds of raw material and produces a single, consistent output. The unification was deliberate three inputs sound like three products, three editing surfaces, three publish flows. By collapsing them into one output template, the AI absorbs the difference.
INPUT 01
Photos
The model extracts both location signals (from EXIF metadata where present) and visual vibe (food close-ups vs. landscapes vs. group shots vs. architecture) so a folder of photos becomes a sequence of moments the blog can be structured around.
INPUT 02
WhatsApp chats
The model pulls out characters (who's in the trip), timeline (which day was what), and tone markers inside jokes, recurring phrases, complaints. The output reads like the group, not like a brochure.
INPUT 03
Prompts
Free-form text plus optional mood tags. Used when the user has no photos to upload they just want to write about the trip and have the AI structure it into a blog.
However the user came in, they walk out with the same thing: a blog they could publish without editing further. Same template, same author card, same rich-text editor, same Publish action.
Module 01 · Chat Flow
A chat surface for users who already speak chat.
The chat surface borrows the familiar shape of a chat product without trying to be ChatGPT. Mr. RYT has a name, an avatar, and a tone that's helpful without being chirpy. The conversation lives at the centre with generous breathing room closer to a doc-with-a-helper than a customer-support bot.
Why a named AI
“Mr. RYT” instead of “Assistant” was both a brand decision and a warmth decision. The brand already markets the AI as a “buddy” naming reinforces the partnership framing. It also gives the user a consistent character to talk to across the (eventual) wider Mr. RYT product surface.
How action chips work
The chips at the bottom of the input Blog Studio, Post creator, Reels Craft frame Mr. RYT as a multi-modal content engine. Today only Blog Studio is in design; Post Creator and Reels Craft are future scope, not yet started. Showing them now hints at the product's direction without overcommitting.
The “Analysing…” state
While the AI generates, Mr. RYT shows a quiet italic “Analysing…” not a spinner, not a fake percentage. The serif italic borrows from the rest of the brand and signals craft rather than computation.
.png)
.png)
.png)
Module 02 · Guided Form
For visitors who haven't met the AI yet.
The guided flow lives behind the public blog page. A visitor scrolls past hand-picked customer stories, hits the “Ready to share your travel story?” section, picks a CTA card based on what they have (photos or chat export), and lands inside a three-step funnel.
STEP 01
Upload
Empty state is a low-anxiety upload zone. After the first photo, the surface flips to a horizontal carousel with focus rings on each thumbnail a small visual confirmation that “this one's in.” No status text required; the ring is the receipt.
STEP 02
Tags + textarea
Pre-set mood tags (Relaxing, Adventurous, Cultural, Memorable, Joyful, Peaceful, etc.) give the AI structured emotional context without making the user think. Textarea capped at 500 characters with a counter signals “we want a sentence or two, not a novel” and keeps the AI prompt window tight.
STEP 03
Generate
“Generate Blog” hands off to the same AI engine as the chat flow and surfaces the same output. From here, the experience is identical regardless of which flow brought the user in.
.png)
.png)
.png)
.png)
Module 03 · Unified Output
One blog template. However the user got there.
The output is the moment both flows converge. The chat-flow user clicks the blog card preview; it expands into the editor. The guided-flow user hits “Generate Blog”; the same editor opens. Same author profile, same rich-text toolbar (bold / italic / underline / list / alignment / line-height / colour), same cover image, same Share / Publish actions in the top-right.
The blog publishes into the same visual system as the five customer stories already live on the RYT site. When the marketing team picks a generated story to feature, it slots in alongside hand-written ones without retrofitting.
Why this matters
Three input modes sound like three products. Collapsing them into one output template means the AI absorbs the difference. The user only ever has to learn the editor once.
Mobile
I designed desktop-first and have started on mobile. Mobile screens will be added below as they're finalised.
Impact & Status
What's shipped. What's in build. Honest.
The generator's user-facing frontend isn't deployed yet. So this section won't claim user-impact metrics it doesn't have. What's real today are Internal Metrics (process-level design iteration, time to prototype, dev handoff) and Design Metrics (output-level flows, screens, modes designed). Product and Business metrics are reserved for after launch, when they can be measured honestly.
27
Days from kickoff to live website (Jun 29 – Jul 25, 2025) design + 2 intern devs led, full-stack build.
Internal · Time to Market
3 → 1
AI input modes consolidated into one publishable output template photos, WhatsApp chats, prompts.
Design · Interaction Cost
2
Entry flows designed (chat + guided form) feeding a single AI engine, split by user fluency, not by feature.
Design · Navigation Success
5+
Real customer blogs already live on the website the visual system the generator publishes into.
Internal · Handoff Acceptance
1
Internal itinerary builder shipped to the RYT team designed by a peer, supported on visual system.
Internal · Cross-Team Delivery
—
Generator launch metrics: Time to First Output, Onboarding Completion Rate, and Form Abandonment Rate to be measured post-launch.
Product · Reserved for launch
Takeaways
What I took away.
1
Design for the second user, not just the first.
My instinct was a chat-first generator. It worked for engaged users and broke for cold ones. The lesson wasn't “chat is wrong”. It was that one entry point can't carry two mental models. The second flow wasn't a redesign; it was an addition. That distinction mattered for keeping the project on schedule.
2
Unify the output, not the input.
Three input modes sound like three products to maintain. By collapsing them into one publishable blog format, the AI absorbed the difference. The user learned one editor, the marketing team got one consistent surface, the dev team built one publishing pipeline. Constraint-as-product.
3
Lead by shipping the surface the AI publishes into.
The website went live first in 27 days, and that turned out to matter. The generator isn't designing into a vacuum; it's designing into a real visual system, a real blog page with five customer stories already live, a real marketing team's workflow. Knowing the surface ahead of the engine kept the generator's design grounded.
4
A named AI is a brand asset, not a gimmick.
“Mr. RYT” instead of “Assistant” cost nothing to ship and changed how the product feels. It gives users a consistent character across (eventually) the broader Mr. RYT surface trip planning, content, recommendations. Naming is the cheapest way to turn a feature into a product.
5
Leading interns is a design skill.
Shipping a website in 27 days with two intern developers required me to design with their build capacity in mind, not against it. I learned to scope features by what the team could ship, not by what looked best in Figma. The website went live because of that constraint, not in spite of it.
