A billboard design for an architecture firm indoors.

Project Disciplines

01
Research
02
Brand strategy
03
UI/UX design
04
Graphic design
05
Marketing collateral
A green business card displaying logo on top of succulent plants.

Optimized Website Refresh

Showcasing their holistic architectural designs and services took center focus during the collaboration between ArtVersion and moss design.

Looking to refresh the design and development of their website, moss was seeking to modernize their digital presence with a better look and feel that captured their work and company ethos. ArtVersion designed a website that elevated its design language with rich, optimized visual assets and photography that captured every detail of its spaces, with a variation of proportions and sizes for visual interest. Further, the site was also developed with intuitive functions and mobile-ready interactions.

Photo of a cabin in nature during the sunset.

Design Systems

A laptop displaying a ux home screen sitting on a table.

UI Screens

Web Design
Web design for architecture firm's home page.
Home page imager gallery web design for architecture firm.
A blog and press user interface design for an architecture company.
User interface design for website services page—architecture industry.
A website homepage showcasing "Methods" user pathway with an architecture team collaborating.
A mobile UX UI screen on a fabric couch.
Web design for architecture firm's home page.
Moss Screen Grid
A IOS mobile screen featuring 4 apps in the dock.

Responsive Design

Mobile
UI UX Architecture company website home screen.
UI UX Architecture company website residential screen.
UI UX Architecture company website site selection screen.
UI UX Architecture company website various icons.
UI UX Architecture company website holistic design and projects.
UI UX Architecture company website screen with photos of projects.
Poppins Light A letter.
Poppins
Light
Poppins Regular A letter.
Poppins
Regular
Poppins semi-bold A in orange.
Poppins
Semi-Bold
Poppins bold A in orange.
Poppins
Bold

Typography

Poppins was the selected font choice for the website because it encapsulated the simplicity and minimalism that the website was leaning toward. Its uniform thickness and balanced spacing provided that tidy and uncluttered look and feel that the team was seeking. As it supports a wide range of weights and styles, Poppins offered subtle but significant differentiation without compromising the overall simplicity.

Color Selections

To mirror moss's commitment to sustainability and holistic design, ArtVersion crafted a color palette that reflected this ethos and injected vibrancy into the design. To introduce a lively element that resonates with moss's logo, the team incorporated a color story of vibrant and colorful hues. This addition brought just the right amount of visual interest to the site, balancing simplicity with engaging color.

Magpie Green
#BFD34B
Monarch Orange
#EA8942
Sea Foam
#ECECEC
Snow Storm
#FFFFF
Black Jasper
#313131
Instagram posts for an architecture company.
A UX home screen of an architecture website on a laptop sitting on a bed.
Cover design of an architectural magazine.
Page spread design of an architecture catalogue with architectural drawings of a river.
Page spread design of an architecture catalogue with architectural drawings.
Page spread design of an architecture catalogue.

Design Language

The website’s design prominently embraced a minimalist aesthetic, thoughtfully utilizing white space to accentuate its comprehensive collection of imagery. This deliberate design approach coordinated with moss’s brand identity, allowing their architectural designs to command attention. To enhance visual interest and maintain the minimalist theme, the site also incorporated geometric visual elements. The structuring of images within square blocks added a layer of sophistication, subtly complementing the architectural themes moss is known for, without overshadowing the showcased work.

Logo for an architecture company on a lime green tote bag.
A architecture firm paper tube with a company logo on it.

UI/UX Development

To encapsulate moss's distinguished legacy, data migration was imperative.

ArtVersion's development team strategically transferred archived blogs, news, press releases, and project narratives into the redesigned website. This content was restructured within an engaging, user-friendly page layout and hierarchy, breathing new life into the web pages. In the process of backend development, the team also refined the categorization of each project, enhancing the user journey and simplifying the search for specific projects.

The result was a significantly improved website experience that enhanced moss's digital presence and highlighted their holistic and sustainable architectural designs. Their refreshed digital platform was now poised to better serve the architecture team and attract future clients.

Two coffee mugs featuring an architecture firm logo.