loading pixels tweaking margins squinting eyes edging borders shifting elements correcting my posture

Fruitworks Coworking

For this project I was tasked to rebrand a well-established 10+ year business, utilising 3D Modelling to navigate COVID-19 lockdown limitations and experience design for customer retention. In 2020, Fruitworks (formerly Fruitworks Coworking) expanded their services to also include private offices, events space hire and meeting rooms, coffee and catering services, and even ventured into the radio industry. This expansion prompted the need for a complete rebranding and new collateral to showcase their wide range of business amenities, just before COVID-19 hit.

About the Business

Fruitworks is a coworking space that has evolved into a fully-fledged professional business center located in Canterbury, Kent. With over 10 years of experience, they have received multiple awards for being the best and most established in Kent, and currently serve more than 150 regular customers.

My Role

  • Avatar of George Beresford George Beresford Designer, Developer, 3D Modelling
  • T Tony Editor, Project Manager

Target Audience

Business Owners, Start-ups, SMEs, Students

Project Disciplines

Logo Design, Branding, Print Design, Prototypes & Mockups, Motion & Animation, Digital Banners, Responsive Design, Landing Page, API Integration, WordPress Websites, 3D Modelling, Menu & UI Design, System Design

Previously a one-focus business, now needed a family of marks for each new offering.

Fruitworks already had a strong brand presence, and was easily recognised by it’s orange “CO” (standing in for CO-working and CO-mmunity) which had to stay. The brand needed to become more versatile, the logomark adaptable, and the messaging to remain: Affordable, flexible, and everyone’s welcome to join this community.

Challenges

Fruitworks' business offerings were expanding, and they needed to expand their identities for these new divisions.

Solution

Taking notes from their existing brand, I refined and modernised the primary brand mark. From here, I created identities for Coworking, Radio, Studios (offices) and Events each with their own visual language.

Refinements were made to the existing logo to improve scalability and modernise the already 10 year old brand. Alignment issues were also corrected, where the text and emblem sat slightly askew and unnoticed from one another.
Internal stationery and signage were updated to reflect the new brand, using black heading typography improving readability from a distance compared to the current thin slab-serif.
The Fruitworks Rewards logo was designed to fit the family of new brands, but needed to be distinct enough as it's own offering; A loyalty program for loyal customers.

Designed to be as Bold and Vibrant as it's loyal community.

During the Covid lockdowns, in-person tours were not popular. It was important for new customers to see the amenities without having to be there during the “stay at home if you can” advisory. Now that the in-person tours are no longer popular, the 3D rendered graphics of the workspaces continue to provide great value for future marketing and print collateral. They showcase even Canterbury’s smallest and most awkwardly L-shaped rooms without requiring a photographer to hang out the window and risk their life.

The studio office renders began with the original scaffold board desks, however were later updated to feature the newer desks
All the furniture featured in the renders was meticulously modelled from scratch, following online schematics available from retailers that included Argos and IKEA.
Experimentation from full low-poly style to smooth-shaded, featuring light leaks from the missive Laptop Screen
From Wireframe, Solid, Look-dev, to Rendered view. Each scene shared the same lighting setup to ensure consistency across all renders.
Experiments also included adding back-walls to further waypoint the features Meeting rooms and the Event space had

Built on WordPress, with fun little mini-games and interactive web apps.

The team at Fruitworks needed to regularly update their website to manage availabilities, studio office vacancies, and their list of growing members and business partners Advanced Custom Fields and Custom Post-types allowed me to extend the WordPress’s usual editing capability beyond pages and posts, adding Members, Rewards, Studios, and Pricing.

In addition to an editable website, they also wanted to improve internal processes to provide faster and more responsive customer service. Working together I learned they use an internal Google Calendar for room bookings, however sharing this calendar was cumbersome beyond just sharing a link. I developed a Meetings & Events calendar app using Google Calendar’s API which allowed members to view the current availability without needing to query over email as often.

Challenges

Fruitworks Members needed to be able to view and check meeting room availability regularly to allow them to drop in for a quick call when unoccupied. This app was also public-facing, so any confidential information could not be publicly displayed for everyone to view.

Solution

A web app using Google Calendar's API was built on a subdomain, allowing the team to easily share the app to all members. This app auto-refreshed using AJAX, and as the app did not require a login, I had to ensure I was methodical in how I called in event data through the API. I ensured data endpoints would only ever request specific fields, allowing the team to keep their private notes and comments, private.

Image of an iMac displaying the Fruitworks' website. The hero section reads "Hey, we're Fruitworks! We've been in town for a while, won a few awards, but we've just got bigger and oh-so much better. If there was that perfect time you were waiting to try coworking, that time is now!"
An issue the Fruitworks team faced for event bookings were sparce enquiries providing next-to-no information about an event. In an attempt to streamline this process, I developed a JavaScript powered multi-step form to capture better results. This provided more valuable leads for Fruitworks streamlining their event-vetting process as some events were prohibited under licensing laws.
A new streamlined contact page was developed following the trial of a Multi-step Form, which provided the team with equally as valuable leads without putting off visitors with a large wall of text input fields.
Using SVG Filters to apply duotone effects to images, allowed the team to easily replace and update featured images without needing to know how to apply Gradient Maps in image editing software.
This SVG filter is converting the image to grayscale, and then based on each colour channel mapping that value between a specified Light and Dark Brand Colour
Originally using a mixture of CSS and SVG trickery to achieve a cross-browser background blur, this became a significant performance issue once members grew over 100. I adopted another technique using a HTML Canvas element and sampling the average colour from each four corners of a scaled 2x2 pixel image
Feast Friday was a fun little side project to help Members choose where to go for lunch that week. Randomly cycling through all the available restaurants in Canterbury, the web app would randomly select a venue to try through a fun little experience with confetti!

Customer Retention was at an all-time low, as Members packed up and left in fear of another Covid-19 Lockdown

As part of the teams efforts to retain customers, a loyalty program was devised to reward those who stuck by Fruitworks in the hardest time for all businesses – the Covid-19 Lockdowns. A new logomark and design language, as well as updates to the website, were developed to feature and showcase rewards, discounts, and freebies offered to those who were willing to stick by and continue their membership to secure the unknown future of Fruitworks.

Challenges

There was no way to login to a members portal, and the team didn't wish to have this functionality. All rewards would be freely available to be viewed publicly on member's profiles.

Solution

Instead of designing the platform as a private portal, I shifted mindset to think of the rewards program to be an additional aspect of a member's profile. In the form of achievements, the team were able to add to and award achievements from the WordPress backend without needing to bulk up the existing website with member login functionality, and automatically calculated membership-term dates were added in the form of progress bars to showcase the dedication members had already displayed.

The Fruitworks Rewards logo was designed to fit the family of new brands, but needed to be distinct enough as it's own offering; A loyalty program for loyal customers.
As I knew achievements would be tiered, I designed them with modularity in mind. Each tier of award had it's own background, from Bronze, Silver, Gold to Platinum.
Each achievement art was constructed with a blur, the background, and an HTML editable foreground featuring replaceable SVG icons and editable count text.
As I knew achievements would be tiered, I designed them with modularity in mind. Each tier of award had it's own background, from Bronze, Silver, Gold to Platinum.

Project Conclusion

Fruitworks was my first professional-level gig where I utilised new 3D Modelling and Rendering skills, and was the start of a fiery passion that ignited my desire to venture into Game Design. From critical-thinking and problem solving in an unknown COVID-19 landscape, to creating usable and fun web apps. I engaged in critical thinking and problem-solving, leading to the creation of engaging and functional web applications.
Let's talk - 3D rendered graphic, bubble text

Make it memorable — from first click to everlasting impression.

From interactive storytelling to immersive 3D experiences, not many can create a digital journey that sets you apart from competitors and captures your audience.