Project Overview:

My role in this project was to translate a provided Figma prototype into a live website with micro interactions and simple transitions between sections on a landing page, while sticking to the provided layout but optimizing for responsive design across various devices.

‍

Key Considerations:

It was important to follow design rules utilized in the Figma layout, as these were established as guidelines for the recently updated brand identity. As the website has expected additions over time, provisions have been made to quickly allow for the introduction of new pages and links when needed.

‍

Project Overview:

With the completion of the KnowRoaming e-commerce site, the client wanted to develop a mobile platform that would provide all the same functionality as the website in a dedicated app for iOS and Android systems. This meant wireframing a prototype that adapted the user journey from the web platform into three key elements; product purchase; purchase(s) overview, and user profile. Within these core functions the sub-goals were established based on common user goal questions such as 'how are products found for purchase,' 'what steps are required for purchase,' 'how is a product activated,' 'how does the user get product support,' etc.

‍

Key Considerations:

It was important that while the app be developed as a stand-alone product, the visual identity should remain inline with that of the web platform, so common interactions and colours were retained for consistency. Navigation should also be intuitive, so industry standards were considered when laying out the menu and core interactions.

‍

Highlights:

With user testing and feedback, and through atomic design principles, adjusting the layout or flow of specific user functions was quickly achievable, with minimal design time. The core variables used also allowed for customisation of this layout for partner brand proposals and adaptation into other platforms.

Project Overview:

Post completion of the white-label template for the client, a prototype based on the updated format needed to be build, but modified to be distinct from other brand partners using the template. This meant adjusting all components and interactions to create a distinct visual identity. As there was already an established CI for the KnowRoaming brand, those guidelines were followed to maintain constancy. Marketing materials for the platform were also required, along with Mailchimp templates, and other digital stationary to match the site re-launch.

‍

Key Considerations:

Making the platform feel distinct to other brand partners using the same template, but without altering functionality to reduce development time and costs, was important to the client.

Project Overview:

An online eSIM provider wanted to refresh the white-label template for their e-commerce platform, as well as utalise this template on a brand partner build. I was brought in to provide a design review on the existing platform and create user flows and personas to assist with defining clear goals for each page. I then designed the wireframe and prototyped the white-label template, using atomic design and easily modifiable variables to work with developers in adapting it to the Flux Wireless brand.

‍

Key Considerations:

As the white-label template would need to be quickly modified and adapted to partner brands, clear design rules needed to be established. Variable based components were designed to update based on key tokens, allowing for rapid customisation of the prototpye.

Project Overview:

Based on the Bleau & Co coffee shop, I built a concept website around the brand in Figma to learn the tool, and understand how to prototype various platforms. The goal was to understand how to layout elements with the software, make sure the content is responsive, and then create a quick prototype with simple interactions. Post the Figma build I replicated this layout in Webflow to make sure there was consitency between concept and build.

‍

Key Considerations:

As this was used as a learning project, I wanted to keep the layout and design as clean as possible, to focus more on understanding how Figma functions.

Project Overview:

I was consulted on how the client could transition their existing website from WordPress to a new platform that would allow them to run several functions in-house without having to outsource to an advertising agency. The design needed to be replicated exactly and SEO optimised on the new build, along with making sure it was responsive between devices. Post consultation I was hired to migrate the platform as a designer in Webflow, making sure to meet all required goals.

‍

Key Considerations:

The blog component of the platform needed to be constructed for use of posting, as the marketing team was not familiar with the Webflow interface, so databasing of these posts had to remain fairly straightforward. Also, based on the clients experience with alternative services, the wanted to make sure all components used were native to the new platform and not third-party plugins.

Project Overview:

two-minute ramble is a blog focused on content I find interesting, which is primarily video-gaming, but also popular-culture TV show and movies. I wanted to empower myself to build this type of platform from scratch with limited code knowledge and so used that as a basis to learn Webflow. I scoped how content would be captured and displayed from various interlinking databases, but also wanted to ensure I could update these at any point to include new functionality, such as adding reviews mechanics or retail listings. As I was building a brand, I also used the opportunity to learn more about SEO, and how I could automate content propagation on social media.

‍

Key Considerations:

The primary goal with creating two-minute ramble was to build myself a platform without using any templates. It needed to allow me to fully control all elements of the platform, from how the design responded across various break points, to how content was managed and referenced. As I have a basic understanding of HTML and CSS, it also need to offer a low-code solution to how everything is created. It also needed to be responsive across devices, will media elements appropriately compressed to reduce bandwidth demand.

‍

Highlights:

As the project evolved I included dynamic content pages which when an author or score are allocated, the content adapts to display these. I created a user submission pages for content, with restricted access, and added product listings which connect with relevant posts.

Project Overview:

A wine influencer was looking to expand their digital footprint beyond Instagram, as well as create an offering of bespoke merchandise. This meant designing a brand identity to add to the social media persona with a logo and key colours that represented playful side of wine. Merchandise was indented to be fun and fresh, and needed to be hosted on an e-commerce platform.

‍

Key Considerations:

The client wanted to make sure they had full control over their e-commerce platform, so a user-friendly service like Shopify was selected, which meant any updates could be handled be the client without the need to engage with a specialist. The colours chosen for the brand represent light and dark wines, but adapted to meet the playfulness required, and merchandise was designed around this ideal.

Project Overview:

The project had two primary objectives, build an online retail platform for all imported equipment, and design a range of branded products to include with these. The client wanted to utilise an off-the-shelf solution for their e-commerce platform, so Shopify was chosen to manage this. Products were databased and imported onto the platform, and a new range of Rōnin apparel was designed.

‍

Key Considerations:

As the client wanted to manage the platform and product databasing themself post handover, all designs and components used on the platform where stock elements, with no custom templates or plugins used. This was done to avoid future incompatibility with these should the client look to adjust any layout or listing methods.