Alveo Land Website

Alveo Land Responsive Website

Type of work:

Collection:

Tools used:

Designs I have prepared as a solution for the existing Alveo Land website, after the development of the new Avida Land website. Alveo Land is the Philippines’ leading innovative developer of vibrant communities and groundbreaking living solutions.

Mock-ups

This is a partial relayout of the Alveo Land Website desktop version, using the current theme, design and branding.

Alveo Land Website - Home Page

Alveo Land Website

Home Page, Full Layout

The Home Page is a partial relayout that aims to fix and re-organize the visually-wrong elements in the current layout of the website. As a direct way of saying that both Alveo Land and Avida Land belong to the same group of companies, I have patterned the navigation menu and property finder search bar from the new Avida Land website.

Property Listing page

Mosaic waterfall layout

Clicking on the tags will instantly filter the results in the Property Listing page.

Clicking on a property tile in the listing, on the other hand, will open a Property Preview Modal that overlays the entire screen to direct the attention only to the preview/summary of the property. Moving the mouse over the image moves the image as well in a parallax, 3D effect.

Alveo Land Website - Property Page (Magazine variant)

Alveo Land Website Property page

Variation 1

The first variation is a single-page layout that heavily incorporates floating boxes/images, inspired by a magazine-like style. All images, galleries, videos, walkthroughs should be accessible via a single, interconnected Photoswipe gallery.

Property page

Variation 2

The second variation uses an accordion to differentiate each section from another.

Property Page (Accordion variant)
Alveo Land Website - Commtalk Online

Alveo Land Website – Commtalk Online

Blog section

The Commtalk Online, Alveo Land’s Blog section, uses a “waterfall” masonry layout that does not restrict the Article Thumbnails in a 1:1 tile.

What’s New page

Newspaper layout

In contrast, the What’s New Page uses a newspaper-like layout. Upcoming Events should also appear in the list at the right hand side.

What's New

Disclaimer: Any work done for BUILD is not personal work, but rather has been developed for purposes of its client/s. All images and content belong to BUILD and/or the client, unless otherwise stated.

Anything I can help you with?