Sites web
Angelisse Wellness Haven: wellness centre redesign
A full redesign for a wellness and massage centre in the Philippines, inspired by hilot, the Filipino tradition of caring touch: sage, terracotta and bone, and a shop built around a line-drawn figure whose pressure points filter the products by body area. The new homepage also loads 1.21 MB instead of 50.34 MB.
Les études de cas sont en anglais.
- Contexte
- Angelisse Wellness Haven, a wellness and massage centre in Las Piñas City, Philippines.
- Mon rôle
- Design, frontend development, and image production
- Année
- 2026


Ma refonte : avant et après
L'ancien site à côté de mon design, à la même taille d'écran.
Homepage
A sage gradient card with the logo, above a broken image, became a calm first screen: a large serif headline ending in terracotta italics beside a hilot massage scene in an arch.


On a phone
The old phone layout was 780 px wide on a 390 px screen. Now the headline, two buttons and the arch image fit the screen.


Aperçu
Angelisse Wellness Haven offers massage, skincare and wellness programmes and sells self-care products in Las Piñas City. The new website takes its idea from hilot, the Filipino tradition of caring touch: shop by where on the body you would like a little care.
Le problème
The old homepage downloaded 50.34 MB on every visit, which took 40.6 seconds to load on a simulated 10 Mbps connection. On a 390 px phone screen its layout was 780 px wide, it requested images that didn't exist, so visitors saw broken image placeholders, and it loaded fonts and icons from three outside hosts.
La solution
A rebuild with no framework, in sage, terracotta and bone, with a classic serif and a warm sans-serif. The shop is built around a line-drawn back-view figure with seven softly pulsing pressure points; each one is a real button that filters the products for that body area. Wording that promised medical effects was softened, and the shop and FAQ say the products are for relaxation and everyday self-care, not a substitute for medical care. Images are compressed WebP files that load as the visitor scrolls, and the fonts ship with the site, so the homepage makes no third-party requests.
Captures d'écran
Capturées sur le véritable site, en ligne.
Ma contribution
Designed and built the new site, drew the body map, produced the image set and compressed it for the web, built the body-area filter, rebuilt the cart and order page, reviewed the copy for claims, and measured the old and new versions with the same script.
Fonctionnalités
- Body map shop: a line-drawn figure with seven pressure points that filter the products by body area
- Each pressure point is a real button, usable with a keyboard
- House label on every product drawn from the centre's own logo, no third-party brands
- Note in the shop and FAQ that the products are not a substitute for medical care
- Wording that claimed medical effects softened
- The three original customer quotes kept word for word, with a note that experiences vary
- Cart with quantity controls and a reminder that nothing is paid yet
- Order sent as a pre-filled email that the customer sends, with the team confirming availability, delivery and the total first
- Field checks on the order page, including Philippine mobile number formats
Défis techniques
A concept that does something
The body map isn't only an illustration. Its pressure points are the shop's filter, so the idea of caring touch becomes the way visitors find products.
Wellness without medical promises
Wellness copy easily drifts into health claims. Statements that promised to treat conditions were softened, and the site points visitors to a doctor for medical concerns.
Technologies vérifiées
- HTML
- CSS
- JavaScript
- SVG
- WebP
- JSON-LD structured data
Faits tirés du code
- Homepage weight on load
- 50.34 → 1.21 MB
- On load, on a phone
- 50.32 → 0.88 MB
- After scrolling the whole page
- 50.34 → 1.97 MB
- Fully loaded, simulated 10 Mbps
- 40.6 → 0.70 s
- Phone layout width (390 px screen)
- 780 → 390 px
- Products in the shop
- 15
Résultats
- Live at angelissehaven.life.
- Measured with the same script: homepage on load down from 50.34 MB to 1.21 MB on desktop and 0.88 MB on phones.
- No failed requests, console errors or third-party requests on the new site during the capture run.
Enseignements
- The best concept is one that also works as an interface.
- In wellness, careful wording builds more trust than big promises.
- If images are illustrations, say so on the page.
À propos de cette étude de cas
Client website, shown by name. Screenshots and measurements come from one capture script run on the old and new site, on a local server. The 10 Mbps figure is a simulated connection, not data from real visitors. The product and scene images are generated illustrations; people in them are generated too, not the centre's staff or clients. The products carry a house label drawn from the centre's own logo, with no third-party brands, and the shop says the photos are illustrations. Service descriptions and the three customer quotes are carried over from the old site; wording that claimed medical effects was softened, and this case study makes no medical claim.
Vous prévoyez un nouveau site, ou le vôtre est trop lent ?
Décrivez votre projet en quelques phrases. Dans les deux jours ouvrables, vous recevez des questions, une première approche et une fourchette de prix en CHF.