×
A news app in two languages, made for readers who talk back
- Figma
- Prototyping
- Micro-interactions
- Role
- UI/UX design
- Every screen and prototype, app and website
- Team
- Just me
- Briefed by the client through our project manager
- Timeline
- 3 days + 1 week
- A first draft, then the final design
- Problem
- A dated website
- Mixed fonts and colours, and no motion
- Languages
- One design for TMN and Satara Today
- Outcome
- In testing
- Being built by the Spotmies developers
The problem
TMN, Today Media Network, is an English news platform, and Satara Today, the voice of Satara, brings the same kind of news to readers there in Marathi. Both are for everyone, but tuned for Gen Z.
They had a website, but its fonts and colours didn't match from page to page, and nothing on it moved. The client wanted a news app that felt Gen Z and modern, like Inshorts, not another generic news app, and a website to go with it.
Every choice below had to fit these:
- A one-line brief, passed on by our project manager: a Gen Z news app like Inshorts, with a scrollable home feed, a community, a profile, and readers posting their own articles with images
- Three days for the first draft, with no logo or brand colours yet
- One design for two brands and two scripts, English and Marathi
- Phones and desktopThe app and the website
I was the only designer, and design was my whole part:
- MineEvery screen and prototype in Figma, for both drafts, the app and the website
- The client'sThe brief, the brand, and the final say on each draft
- Our project manager'sPassing on the brief, and feedback on the final design
- The Spotmies developers'Building the app and the website
The decisions
The client asked for an app like Inshorts, in white, black and red, which was already how The Newspaper looked, a news app I'd designed on my own the month before. So I built the first draft on it in three days, about 80% of it from The Newspaper, with a scroll that worked exactly like Inshorts'.
The client half liked it: it did what Inshorts did, but it didn't feel Gen Z. For the final version I looked at where Gen Z already spends its time, Instagram, and built the home feed on its scroll. This time I asked for the logos and brand colours first, reused most of what I'd already designed, including The Newspaper's community feed, and finished in a week.
Marathi headlines run longer and sit taller than English ones, so every card, headline and tab had to hold both. Rather than a layout for each, the two apps share one: cards grow to fit a longer headline, and only the words and the masthead change.
For a Gen Z reader, a story is something to react to, not only read. So an article carries more than the story: a pull quote, a quick reaction in their own words (lit, woke, cap, ded or vibe), an instant poll that shows its results, and comments that open from the bottom, with a box for your hot take.
The client wanted readers to post their own articles, so anyone can write. A new article takes a title, tags, the text with its formatting, and images or video, then publishes from the top. Your articles sit on your profile, with your followers, badges like News Hound and Comment Guru, and settings like the dark theme and offline mode.
The final design
The client asked for white, black and red, so each got one job. Red is the news: breaking stories, the Trending tag and whatever you've selected, so it always points at something. Black is the ink, and white the page. Headlines are set in Epilogue and everything else in Inter, and every chip, tag and button is fully round.
Colour
Type
Epilogue, for headlines
Inter, for everything else
आयफोन 17 आघाडीवर
Marathi takes the same sizes and the same layout
Shape
One shape, fully round: chips, tags and buttons
The app opens on a feed and the website on a briefing, the client's call: Gen Z reads on phones, where a feed fits, while the website is more for a proper catch-up. It opens on your briefing: the date and the local weather, the top stories in a carousel with the most recent beside them, then local stories, sport and your topics. Every category sits in one row under the search, and the fonts, colours and motion are consistent from page to page, which the old website never was.
The TMN News website, in English.
What happened
The client approved the final design, and the Spotmies developers are building the app and the website, both now in testing. No readers are on them yet, so there are no numbers to share.
I designed the first draft carefully, and made it work just like Inshorts, as the client asked, and they still didn't like it: it didn't feel Gen Z. When I took Instagram as the reference instead, reusing most of what I'd already built, they did.
- What I learnedA reference in a brief is a starting point, not the requirement, so I now ask what the client means by it before designing anything
- What I'd changeAsk for the brand, and what Gen Z means to the client, before the first draft
- What I'd do nextOnce it's live, watch how many readers react, vote or write, since that's what makes it Gen Z