In the initial phases of developing the telecommunications application, our focus centred on enhancing functionalities related to account management and self-assistance.
Our overarching objective was to redefine Vodafone's identity, transforming it from a utility-centric entity into a dynamic and engaging lifestyle brand. This involved seamlessly integrating innovative elements such as eCommerce, loyalty programs, travel assistance, and other smart features, all strategically designed to enrich and streamline the user's daily experience.
Extensive design exploration has been undertaken, leading to a meticulous refinement process encompassed thorough planning, conceptualisation, development, documentation, and implementation. These endeavours were dedicated to infusing the My Vodafone app with a visual language that resonates with lifestyle and aspirational content, tailored to user behaviour and fostering an immersive and captivating user experience.
Among the notable enhancements are; a revamped rewards scheme. New billing modal for better clarity on charges and payment features etc. A Marketplace featuring exclusive offerings and discounts. Adding a dark mode option. Better roaming assistance for international travel, and a host of other quality-of-life changes designed to elevate the overall user experience.
Client
Fantom Factory specialises in providing technical support and training for businesses in the Smart Buildings industry. Offering bespoke e-Learning courses for SkySpark and Project Haystack, helping organisations navigate the challenges of collecting and interpreting relevant data for energy efficiency.
Brief
Design a visually appealing new page layout that caters to different learning preferences.
Ensure accessibility for all users, considering various learning types and conditions.
Maintain an engaging yet focused design to prevent distraction from the learning material.
Allow customisation options for colour, theme, language, etc., to accommodate personal preferences.
Prioritise intuitive navigation and provide easy access to help and support resources
Challenge
Disassembling all the information around the structure of the courses and how it was being presented to audiences. Revising a better way to streamline the content in a more succinct fashion.
Result
Full redesign keeping elements of the original theme (colony space venture). Shifting priority content and removing clutter/useless information. Improved navigation for ease of use. Increasing engagement for course completion with the help of a new colour pallet, fonts, illustrations, page layout and micro-interactions. Better accessibility, support and custom features for a more personal experience.
Client
Equiniti Group plc is a British-based outsourcing business focused on financial and administration services. It is listed on the London Stock Exchange and is a constituent of the FTSE 250 Index
Brief
Redesign Equiniti’s financial service products for internal clients using UI/UX principles. Work with system analysts to ensure application integration supports the optimal user experience and to better understand how clients are using the site on a transactional level that meets their needs.
Challenge
The first point of call was making sense of the IA (Information Architecture), breaking down large portions of the site and restructuring them through systematic organisation to establish a more logical navigation system accessible to all. This included the application of a brand new style guide that was to be adapted across old and new products.
Result
The end result was an intuitive IA restructure that is transparent between the product and the client, removing apparent pain points with information presented in a clear and structured way.
With a new cleaner visual aesthetic that further enhances the experience and a usability.
Client
iLendi is a social networking platform for home buyers and lenders which brings convenience, unique services, transparency and social commerce together for a better borrowing and home buying experience.
Brief
High level redesign from some existing pages at ilendi.com (Note: some screens may have been modified since posting). Layout restructure, new components, navigation, footer, assets, copy and mobile responsive.
Landing Page.
There were several issues with this page. A lot of the copy had to be striped back because it was overloaded with too much information. Users generally just scan content and if overwhelmed can lose interest quickly, leaving your site and possibly missing key information they were originally looking for. Hampering conversion rates.
Messaging should be clear, brief but comprehensive. Accessible call to actions with labels that make sense and not using internal marketing jargon. Random images were removed and replaced with new ones that were relevant to the content. Like screenshots of the app on mobile.
Dashboard
Designed from the ground up. A great central hub area for customer accounts. Easy to manage and customisable tiles. Snapshot details of loan applications, personal documents, relevant community articles, loan agency details and more. Functional while also aesthetically pleasing.
Application form
Complex forms restructured for better accessibility, using current best practices already established and widely used. Easy step-by-step processes, digestible and progression indicators with helpful tips only when needed.
Learn Centre
Articles and Video arranged by relevance. Images were added to the thumbnails to enhance the page aesthetically.
FilmFam is a cinema app designed to transform the movie-watching experience for users. The app aims to provide a seamless, interactive, and personalised cinematic journey. Key features include:
Smart Movie Suggestions
Utilise advanced algorithms to analyse user preferences, viewing history, and ratings.
Provide personalised movie suggestions for an enhanced user experience
Interactive Seating Maps
Integrate interactive seating maps for users to select and visualise their preferred seats in advance.
Seamless booking process with real-time updates on seat availability.
Cinematic Events and Promotions
Feature exclusive cinematic events, premieres, and promotions to keep users engaged and excited.
Provide notifications for upcoming releases, special screenings, and limited-time offers.
In-App Concessions Ordering
Enable users to pre-order snacks and beverages from the app.
Streamline the concession pickup process for a hassle-free cinema experience.
Social Integration
Incorporate social features allowing users to connect with friends, see their movie plans, and coordinate cinema outings.
Share favourite movies, reviews, and experiences on integrated social media platforms.
and much more…
FilmFam, aims to not only streamline the movie-watching process but also create a community-driven platform that enhances the overall cinematic experience for users. It combines technology, personalisation, and social interaction to redefine how people engage with movies.
Idea:
Design a cooking app. iOS
The Benefit:
Customers can find easy to make homemade meals including healthy snacks and treats. Directly from the detail pages, you can select the ingredients you need and seamlessly order them directly through the app for either collection or delivery. This is all linked via an account of your favourite participating third-party grocery vender(s). If there is more than one vendor listed it will compare prices for the cheapest option. This process can be set up after creating a free account through sign up.
Logo/Font:
The logo uses the Alfa Slab One font. I wanted a contemporary look with an extreme colour density. Something bold to emphasis the name Grubbo and read clear on light and dark backgrounds.
This is followed by the cheeky tagline “You hungry?” supported by the one time use of Satisfy.
Montserrat being one of my San favourites was an easy choice to support headers and body copy variants appearing on the app.
Colours:
Light pastel shades with Burnt Brown used as a variant for the Grubbo logo and outlines for all the illustrations. Custard Yellow is used primarily for the on-boarding screens and Secondary buttons while Mint Green supports the Primary buttons.
Images:
All delicious food photography is supplied by the amazing people at https://unsplash.com/. Additional contrast edits were made to deepen the pictures.
Creative Tools:
Sketch, Photoshop, Illustrator.
Brief:
Create a platform for small/medium size businesses that can simplify the everyday running of the company by providing smart data to help with performance and have a greater understanding into how customers are interacting with your product(s).
Challenge:
The tool had to be intuitive and pleasant to use, not a chore. Easy to set up and customisable to suit the way you like to work. Also flexible enough to accommodate a multitude of trade requirements for capturing data.
Solution:
Design a Smart Business Dashboard that saves time and effort with a snapshot overview of the information you need to help manage areas of your business all in one place. The insight tiles can be in the form of an infographic, graph, article or other textual data. Clicking though would take you to detail pages for more granular information.
With the addition of app integration you can see your money-in and money-out next to available funds, profitability and other banking information. Set up financial goals to track overall company performance which can be customised appearing as recurring and non-recurring insights.
There are also relevant articles tailored to the business, with support information. Tips and guides from the bank and social community to help boost company performance in areas that may fall short.
Brief:
Create clean, responsive, intuitive, functional user interfaces that are data heavy and map based. Uplift existing pages using company branding.
Challenge:
Update and add to the existing styles with limited guidance, including new components, buttons, icons etc. Making sure complex components worked correctly across the break points
Process:
Looking at the overall behaviour, and structure of the site to see what areas needed improving or replacing. Much of the responsive element wasn’t working too well so this had to be rethought from the bottom up. Mobile first.
I modified some of the layout so it was more readable and clearer. Easier to scan. Maps and charts are all interactive so these were also adjusted to feel more intuitive. They also had to accommodate various amounts of data. At the early stages, prototypes were created to make sure the pages worked as intended and easier for the developers to build/replicate.
Brief:
Design a new online support platform to help customers self-diagnose technical issues with their BT products.
Challenge:
Come up with a solution to help reduce physical call volumes to BT’s support centres that were becoming unmanageable. Also design a batch of new and old device illustrations to support the journeys.
Process:
We created a set of intuitive online tools for customers to self diagnose technical problems. This support would cover areas of Broadband, Home Phone and Mobile devices, TV Boxes, Engineer callouts and Deliveries.
The diagnostic flow worked via a 3 step concertina type structure. Each section broken down with clear step by step instructions moving to the next once completed. Account checks for verification, Diagnostics to begin the process then finally the Result page. Working alongside with the backend development team, making sure the new designs were supported was key, as this would sit on a new system.
Copy was also a very important component of these journeys. Because they can have variable outcomes, the tool had to be smart and flexible enough to support different users inquiry. Keeping copy to a minimum, reducing jargon and overload. Lots of white space and clean pages. Good use of iconography and accessibility.
Mobile first.
Project description in progress..
The App:
iOs and Android
Brief:
Bring the app inline with the new brand.
Process:
With the new branding, old pages were uplifted with all new ones created including iconography that were added to the set. The end-to-end journey was also reimagined to accommodate new and existing flows to feel more cohesive and improve accessibility.
Project description in progress..
Update in progress…
Project description in progress..
Brief:
Based on the new Ducati speedster, design bespoke imagery for a Brochure to be used as part of a presentation.
Process:
The speedster imagery was supplied by Ducati themselves but I choose which ones would be used showing the bike at different angles to work for my pages. The original bike was blue but I changed it as I wanted red accents instead to matched the logo.
The reds would also complement the showroom/studio backdrop setting designed from the ground up simulating spotlights along the wall and floor bringing it all together.
I made the cover page, a table of contents and the back cover. Each allowing enough room for text to be inserted if required.
A personal piece I designed for some merch printing.
Sentinel - “a soldier or guard whose job is to stand and keep watch”
This dude is definitely watching…