Client cases Case 02

Lavender Forest 99 Peaks | A 3D park map: the whole park as the home page

Lavender Forest, Nantou 99 Peaks (concept proposal)

Brands and creative3D siteCorporate siteConcept proposal

Lavender Forest, Nantou 99 Peaks website
  • Industry

    Leisure park, dining, and retail
  • Services

    3D website, gamified wayfinding, website content consolidation, CMS admin panel
  • Type

    Concept proposal
  • Result

    The 3D park map is the website · five zones, 21 places, and a suggested route on one map

Background

Lavender Forest's 99 Peaks park sits at No. 258 Yishu Road, Caotun Township, Nantou County. A helium balloon ride lifts visitors high enough to look out over the 99 Peaks. The park is home to the Hi & High helium balloon, restaurants such as Herbs Table and Xin Zhi Fang Ting, shops such as Bring Your Présent Back and Lavender Forest Select, as well as gardens, a 15-degree lawn, a cherry grove, a skywalk, and forest trails. The official website is thorough, covering tickets, hours, directions, balloon rules, FAQs, classes, venues, and weddings, but it is spread over more than a dozen pages, and the park map is a flat image.

This is a concept proposal by 留白設計 BLANK DESIGN, with the 99 Peaks park as its subject: what if the park's website were a map you could walk through, so visitors have already been around the park before they leave home?

The challenge

People who visit a leisure park's website ask practical questions: What's here? Where's the balloon? When do the restaurants open? How do I walk from the parking lot? Should I buy tickets in advance? The old site has all the answers, but finding them means switching back and forth between pages, often on a phone, before setting off or at the gate.

The park, meanwhile, cares about something else: getting visitors to stay longer and see more, so they make it to the balloon, the restaurants, and the shops. The challenge was to answer the practical questions on the same screen while making exploring the park enjoyable in itself, rather than simply turning pages into 3D.

What we did

The idea at the heart of the proposal: the 3D park map is the website. Visitors first land on a home page laid out like a printed magazine, using real photographs of the park to say what it is and when it opens today. Press "Start exploring" and the camera swoops down from high above to the park. From then on everything comes from the map: tap a zone to fly in, tap a place to read about it, and the menu holds all of the official website's content.

Home page: opening on real photographs

The first screen is a full-bleed photograph of the park: on desktop the balloon floating above the 99 Peaks, and on a phone held upright, a vertical shot of the balloon instead. The headline, "Into the forest and sky of 99 Peaks," sits low on the photo, next to "Start exploring" and four shortcuts: What's on, Tickets and hours, Book online, and Getting here. Once you scroll, a slim bar with just the wordmark and "Start exploring" appears at the top, so the map is always one tap away.

Home page first screen
Home page first screen (mobile)
First screen: a full-bleed photo, headline, Start exploring, and four shortcuts, with a portrait photo on phones

Below the photo is a row of figures: 21 places, a 168 m balloon, and 4.9 hectares of forest, each with the number set large and the label small. Then comes section 01, Highlights: the seasonal garden, the Smurfs Skyway, the Hi & High balloon, forest dining, and the gift shop, each as a real photograph in an arched frame. On desktop the arrows move the row one card at a time; on a phone you simply swipe.

Figures and highlights
Figures and highlights (mobile)
Three figures, then the highlights in arched photo frames, with arrows on desktop and a swipe on phones

Section 02, Today in the park, is a daily schedule: opening at 09:00, forest lunch at 11:00, lawn picnic at 15:00, last entry at 19:00, and closing at 20:00. The current time appears in the top right, past slots fade, and the slot you are in is marked Now. On desktop it runs as a horizontal timeline; on a phone it becomes a list, one slot per line. Section 03, Getting around in three steps, sets out the 3D park map, finding a place, and hours and tickets under large numbers 01, 02, and 03, with a note that the park information comes from the official website, whose notices take precedence.

Today and the three steps
Today and the three steps (mobile)
Today's schedule marks the current slot, and three numbered steps explain how to get around

The page closes with an illustration, "The whole park, on one map," and one more "Start exploring." The footer has three columns, Explore, Visit, and About, and every link opens the matching panel inside the map.

Closing section and footer
Closing section and footer (mobile)
A last Start exploring, and footer links that all open panels inside the map

First time on the map: six guide cards

First-time visitors see six illustrated guide cards: the park map, finding a place, hours and tickets, the suggested route, place pages, and booking online. They can skip them and replay them later from the menu.

Guide cards
Guide cards (mobile)
Six guide cards on the first visit show how to rotate the map, find a place, and book

Desktop and mobile

On desktop the map fills the window: search in the top left, the wordmark at top center (tap it to return to the full view), sound and menu in the top right, and two frequently used buttons, Itinerary and Book, in the bottom right. Every panel slides in from the right. When a phone is held upright, search moves down within thumb reach and panels become a drawer pulled up from below; when it's turned sideways, they return to the right.

Key design decisions

Five zones you fly into

The park is large, and labeling every place at once would only clutter the screen. From afar the map shows five zones: Entrance Plaza, Dining, Gardens and Lawn, Balloon, and Forest Trail. Tap a zone and the camera flies in, revealing the names and logos inside, and the URL updates to include the zone, so it can be shared directly with friends in your group. The zones group places by location for wayfinding; they are not the park's official divisions.

The five zones from afar
The five zones from afar (mobile)
From afar only the five zones are labeled, keeping the view clean, like a tabletop model of the park
Flying into the balloon zone
Flying into the balloon zone (mobile)
Tap the balloon zone and the camera flies in, labeling Hi & High and the balloon flight area

The star stands out; everything else steps back

The map is deliberately drawn as a tabletop model in parallel projection: rounded trees, plain walls, and soft, stepped light and shade, with near and far objects the same size, so relative positions read at a glance. Labels are weighted by importance: the balloon and must-see places most prominent, the park's officially numbered places next, the rest lighter, and places outside the park lightest. The balloon is the star, so the Hi & High label is purple and the balloon's take-off circle is visible on the map.

Place pages: photos, introduction and directions

Tap any place and a panel opens its page: photos, logo, category, and official park number, with two tabs, About and Getting here, plus buttons to save and share and, for restaurants, a link to book a table. The content comes from each place's page on the official site, with opening hours on the first line.

Place page
Place page (mobile)
Herbs Table's page: photos, logo, hours, and introduction, with the pin on the building
Getting here tab
Getting here tab (mobile)
The Getting here tab: walking from the parking lot and driving, one turn per step

The directory groups all 21 places into dining, fragrance shops, souvenirs, and experiences and sights, with logos and official park numbers; one tap flies you to the place.

Directory
Directory (mobile)
The directory lists every place by category, with logos and the park's numbers

A menu like a contents page

The menu carries on the editorial style of the home page: instead of a page of icons, it is now a grouped list, like a contents page. A dark purple band at the top holds the three most frequently used actions: Book online, Restaurant booking, and What's on. Below come Explore (My park, Directory, Suggested route, Favorites, Today's balloon status), a card reminding visitors of the Hi & High balloon rules, Visit (Tickets and hours, Getting here, FAQ, Contact), Things to do (Classes, Venue rental, Weddings), About, and finally settings for day and night, language, and replaying the guide. Every row has an icon and an arrow, and on a phone you can scroll through the whole list with one thumb.

Menu
Menu (mobile)
The menu as a grouped list, with booking, restaurant booking, and events on a dark band at the top

The official site's text, prices, hours, and photos all live in these panels, with no need to leave for another website. Tickets and hours puts the park's opening hours, each place's hours, and admission prices in one panel.

Tickets and hours
Tickets and hours (mobile)
Tickets and hours: park hours, each place's hours, and admission in one panel

Getting here and the suggested route

Getting here brings together walking directions from the parking lot, driving via National Freeway 6, the suggested route, and the address, with a navigation button that opens turn-by-turn directions right away and a button to copy the address. Below are the official park map and routes from the north, from the south, and by bus.

Getting here panel
Getting here panel (mobile)
Getting here: walking, driving, the address, and one-tap navigation, with the official park map below

Choose the driving route and the map draws it from the freeway exit to the parking lot by the entrance, with a banner listing the turns along with the distance (about 900 m) and drive time (about 3 minutes). In route mode the route and its destination light up while only the surroundings fade, rather than the whole map turning gray.

Driving route
Driving route (mobile)
The driving route runs to the parking lot by the entrance, with the turns, distance, and time in a banner

The suggested route links the main sights from the entrance: Hi & High, the 15-degree lawn, the gardens, Select, the skywalk, Morihico, the dining area, and finally the gift shop. It is drawn in purple on the map, with a banner listing the order and the distance, about 820 m or an 11-minute walk. The banner also notes that this is only a suggested order and that visitors should follow the park's signage on the day.

Suggested route
Suggested route (mobile)
The suggested route links the main sights in purple, with the order, distance, and walking time in a banner

Contact and booking without leaving the site

Contact lists the phone numbers and extensions for the visitor center, group bookings, classes, venue rental, and wedding menu tastings, each one tap to call. Membership, the LINE official account, Facebook, and Instagram appear as cards with a QR code, and each card has a Go button and Copy link, so visitors on a phone never need to scan a code on their own screen. Booking online lets visitors choose the date, ticket type, and number of tickets on the site, and only the last step hands over to the official ticketing page for payment; restaurant booking works the same way, with visitors choosing a restaurant on the site before handing over to its own booking system. Class sign-ups, group visits, venue rental, wedding inquiries, and partnership inquiries use on-site forms that go straight to the CMS admin panel.

Contact
Contact (mobile)
Contact: every extension is one tap to call, and the membership and social cards have Go and Copy link buttons

Petals, badges, and favorites: exploring as collecting

To encourage visitors to see more, the proposal adds a light layer of play. Opening a place, saving a favorite, and following the suggested route all earn petals; finishing a zone or the whole park earns bonus petals; and badges such as First hello, Favorite, Followed the route, and Whole park unlock along the way, with a small notice at the top of the screen when one is earned. My park in the menu shows the petal count, progress in each of the five zones, and the badges. Progress is stored only on the visitor's own device, with no account needed.

My park
My park (mobile)
My park: the petal count, progress bars for the five zones, and the badges earned so far lit up

Day, night, and search

The map has day and night: by day, seasonal flower colors, lawns, and cars in the parking lot; at night, path lights, soft light washing the building walls, and a gently glowing balloon. It always opens in daytime.

Night mode
Night mode (mobile)
Night mode: path lights come on, and the light on Hi & High keeps the star of the park the most visible

If you don't know which zone a place is in, just search. Typing a single character lists the matches, and choosing one flies the camera there and opens its page.

Searching for a place
Searching for a place (mobile)
Searching for 冰 (ice) finds the ice-cream shop, and the camera flies there and opens its page

Positions checked against reality, and labeled honestly

The park layout has been checked against satellite imagery: the balloon's take-off circle and the small pavilion beside it sit where they really are, the park roads and paths follow their real curves, a straight path that does not exist has been removed, and the entrance now has its ticket booth. Gardens, paths, and the skywalk are drawn from the official park map, and the site notes that they are for reference only; the balloon is shown at an illustrative height. Emergency assembly points are deliberately left out of the proposal because there is no evacuation plan approved by the park yet. However real the map looks, it should never pass for official safety information.

CMS admin panel and upkeep

Places, notices, events, and form submissions are managed in a CMS admin panel. When a new event goes up or a place changes its hours, the panels on the map update as soon as the change is saved. Forms for classes, groups, venues, weddings, and partnerships arrive in the CMS admin panel under Inquiries and sign-ups, where park staff can read them and update their status; the forms themselves validate each field, limit how often they can be submitted, and include bot protection.

Results

  • A magazine-style home page that opens on real photographs: highlights in arched frames, a daily schedule that marks the current slot, and three numbered steps
  • "Start exploring" leads straight into the 3D park map, with five zones you fly into and a shareable link for each
  • 21 places, each with its own page, introduction, and directions, plus a directory and search
  • A menu grouped like a contents page, with tickets, hours, directions, contact, and the rest of the official website inside the map's panels
  • The suggested route plus driving and walking routes drawn on the map, with distance, time, and one-tap navigation
  • Membership and social cards in Contact that open directly, and phone numbers that dial with one tap
  • A park layout checked against satellite imagery, with positions labeled honestly
  • Petals, badges, and favorites to encourage visitors to see more
  • Day and night modes, plus layouts for phones held upright or sideways
Next caseChinese Taipei Athletics AssociationGet a quote