Mobile apps
Yoga studio app example with a live timetable
Students check a studio's timetable more than anything else, often in the morning before class. This example for an invented Bulimba studio reads the week's classes from a collection the owner edits, groups them by day with the time, teacher and level, and takes booking requests.
The app, screen by screen
Each screen as the app renders it on a 390 pixel phone. Scroll inside a phone to read the whole screen.
Screen by screen
- Home /
- Photo, headline and Book and Timetable buttons, Passes with prices, Reformer class card
- Timetable /timetable
- Classes from the classes collection, grouped by day, with time, teacher, length and level, Pull to refresh
- Book /book
- Booking request form: class select, day and time, name, email
- Studio /contact
- Studio photo, Address, phone and parking, What to bring
How it is built
An Expo app from a Code mode site with two data collections: classes, which the public can read, and bookings, which the public can write to. The timetable screen loads classes through the site kit, shows skeletons while loading and a friendly message when offline, and supports pull to refresh. The booking form submits a row to bookings.
Publishing it
The app builder previews the web export in a phone or tablet frame. You build and submit it yourself with EAS on your own Expo, Apple and Google accounts: Apple charges 99 USD a year and Google 25 USD once, and a new personal Google account must test with at least 12 people for 14 days. A timetable that updates and a booking form are the features that make it more than the website in an app.
What makes this app work
The timetable is data, not design
Classes come from a collection with day, time, teacher, length and level fields. The owner changes a teacher or adds a class as a row in the Data tab, and students see it on the next pull to refresh, with no new build.
Every class row answers four questions
When, what, who and how long, with the level as a badge. A student deciding between two classes on a Tuesday can do it from the list without opening anything.
The introductory offer on the home screen
The passes card leads with the first week unlimited at $39. New students are the ones a studio most needs, and the offer is on the first screen of the app they just installed.
Questions people ask
How do I keep the timetable up to date?
Edit the rows of the classes collection in the code builder's Data tab, one row per class, or import a CSV with a dry run first. The app reads the collection when the screen opens and on pull to refresh, so changes show without rebuilding the app.
Can students book and pay for classes?
This app takes booking requests into a collection and the studio confirms them. Passes could be sold as products in the site's store and paid through Stripe Checkout in the app, but there is no class capacity or waitlist logic built in.
Does the app work offline?
The screens load without a connection, and the timetable shows a check your connection message with a Try again button when it cannot reach the site. Booking requests need a connection to send, and the app says so if one fails.
Can the app send class reminders?
Push notifications need the owner's own Expo project and are set up after you export the app; they are not part of the generated app. Many studios start with email confirmations and add push once the app is in the stores.
Does the app have a dark mode?
Yes. Colours come from the site's tokens with a light and a dark set, and the app follows the phone's setting. The build checks the home screen in dark mode as well as every tab at phone and tablet widths.
Build your own in about a minute
The button below opens the generator with this use case already described. Change the wording to match your own, generate, then edit anything you like.
Make one like thisOther app examples
Salon booking app example with services and booking requests
A salon's regulars rebook every six weeks, and an app on their phone makes that a one minute job. This example for an invented Subiaco salon has four tabs: a home screen with the most booked services, the full price list, a booking request form and the studio details.
Online store app example for a small homewares shop
A small shop's best customers buy again, and an app on their home screen brings them back without an ad. This example for an invented Fremantle homewares store shows new products on the home screen, the full shop by collection, a cart priced by the server and the shop's hours.
Restaurant ordering app example for pickup orders
A pickup ordering app pays for itself when regulars reorder from their phone instead of a delivery platform. This example for an invented Leichhardt pasta bar reads its menu from the restaurant's store, adds dishes to an order priced by the server, and shows where to collect.
For everything this generator can do, see the website maker.
Written and checked by the OneCraft team. Last checked .