Duration: July - December, 2021
Research / Design / Testing / Branding / Graphic Design
Working with Island Property to bring a fresh, modern look to their website and brand.
When I was contacted to create Island Property's new website, I was tasked with bringing their current website from 1998 into the present. Early on in the project, I felt that my lack of previous experience working on real estate/vacation rental websites would be a significant challenge. However, I eventually realized my reasoning was wrong and that this project would take the same design thinking as others. I took a very generalized role for this project by designing and developing the new website. The project called for me to conduct research, design, develop, and test the website while also creating branding guidelines with a design system. I knew the biggest challenge would be to rethink the previous design and impress with the new. The user flow of Island Property's previous website was clear and accessible from all pages, but the UI was stuck in the 90s and didn't fully represent their brand identity. Its austere style caused various interaction issues and the site wasn't responsive. Therefore, it was necessary for the site to be built from the ground up. In fact, the Island Property logo was the only thing that carried over from the original site.
Early Design Research
After taking on the project, I began searching for design inspiration from various, modern architectural and real estate websites. This resulted in a moodboard of elements that formed the modern and aesthetically pleasing design I aimed to create. The use of white space and margins were consistent across the sites I studied. This use of an uncluttered, airy design replicates the appearance of a luxury magazine, enticing people to open and read. It was the same bold, inviting style I wanted to introduce to the new Island Property website. Initial Design Sketches
Initial Design Sketches
Once I determined the new website's design style, I conveyed my vision into a paper mockup and showed how it would translate between desktop and mobile screen sizes. After sketching for a short time, I had a few examples of my vision. The modernist design style seemed to already be presenting itself.
Establishing a Design System
Using Figma, I established a design system for Island Property's site with inspiration from my moodboard. The border radius of buttons, hover states, font styles and sizes, and color scheme were all defined in this simple design system. This crucial design step certainly paid off throughout the development of the site.
Building a Prioritization Framework
I used the MoSCoW (Must, Should, Could, Won't have) method to identify the priority levels of different features. For example, a major 'Must' was listing weekly availability for all rental properties. A 'Won't' was implementing an online booking feature, as my client enjoyed the personable aspect of taking bookings over the phone.
Implementation of Design Choices
Using Wix's EditorX development platform, I began building the new site's numerous pages, while constantly referencing the design system to maintain consistency. I implemented large header images, staggered image and description sections, column sections call to action buttons, and more. After a few months of iterating and several minor design changes, the new Island Property website finally achieved the modern and luxurious aesthetic I strived to create. Every element, from rounded borders, to font styles, to image placement was complementary to each other, forming the site's spacious and inviting appeal.
Accessibility is crucial in creating a site that's built for everyone. Clearly defined sections through hierarchy, alternative text for images, and concise, predictable navigation are the first accessibility features I implemented.
I followed the Gestalt Principles when developing the property listings. For example, on the three listing pages (Home, Land, Vacation Rentals) all elements of a listing are grouped in close proximity, so through pre-attentive processing users can perceive the various elements as being for a single listing. I also gave header images rough borders, while all other images on the site have rounded borders. Therefore, through unconscious design a user can decern header images from other images. The combination of these design choices enables users with varying abilities to use the site effortlessly.
In research, it was hard to determine what screen size the site would be viewed on most frequently, so I began designing desktop down to mobile. This allowed me to design everything needed, so when I reached mobile, I rearranged the elements.
At the completion of Island Property's fresh, modern website I had learned to effectively communicate my design choices with clients and gained experience designing and developing a real estate and vacation rental website. The now live website has truly set a new standard for design in the real estate and vacation rental industry in Maine, as many other websites are very dated and in need of a refresh.
- Front-End Development:
- - Html
- - CSS
- - JS
- - Laravel
- - Experience using Squarespace, Shopify, and Wix Editor
- - Responsive Web Design
- - Rapid Bug Fixes
- UX Design:
- - Research
- - Writing
- - Wireframing
- - Design
- - Prototyping
- - User Centered Research, Design, Testing
- - Experience using Figma & Adobe Xd
- - Social Ad Campaigns
- - Mailchimp Campaigns
- - Photography
- - Graphic Designs
- - Music Producing / Songwriting
- - Digital Photography & Cinematography
- - Digital Designs For CNC Machines
- - Hardcore Tennis Player
Freelance / July - December 2021
Tasked with designing and developing a modern, minimalistic website for Island Property, a real estate and vacation rental agency serving Islesboro, Maine. Using Wix’s advanced editor and database management tools, I iterated on vdesigning the user interface, researching, and developing the website keeping usability in mind.
Part-Time / 2020 - Present
Selected to lead the sales marketing & customer experience (CX) for CQC, utilizing and increasing my knowledge of Mailchimp email campaigns and website development/maintenance with Shopify and Squarespace sites and DNS and CDN management. Enhanced their online presence by scaling social media presence and conducting SEO keyword research by analyzing the target audience.
Part-Time / Dec 2020 - Apr 2021
Designed & developed a modern, user focused website while using graphic design skills to create high quality advertisements used in various marketing campaigns across their social media profiles.
Google - UX Design Specialization Certification
Google Digital Garage - Fundamentals of Digital Marketing
HubSpot - Content Marketing
Goldsmith's, University of London - Mathematics for Computer Science
Harvard CS50 - Introduction to Computer Science
Daily UI 100 Day Design Challenge
Hacktoberfest 2021 PR Challenge
Hacktoberfest 2020 PR Challenge
This site is powered by pure HTML, CSS & JS.