Research to Reality: Improving the Emote Digital Website
Digital Marketing Agency Internship
CHALLENGE
High competition in the Digital Marketing Agency space
Wanted to update the website incrementally to not overload developers
Maintaining the SEO of the website
OPPORTUNITY
Learn about the Digital Marketing Agency Industry
Capitalise on current design trends and apply it to the website
Identifying and addressing the target audience of the industry
TIMELINE
December 2023 - March 2024
MY ROLE
UI/UX Design Intern
RESPONSIBILITIES
Web Design
UX Research
Client Collaboration
Branding
TECH STACK
Client
Emote Digital is a Digital Marketing agency that provide Branding, Website Design, and Digital Marketing services to clients, which ultimately leads to increasing the online presence for customers. They are recognized for being the Top Full Service Digital Company awarded to them by Clutch in 2023.
*Most of the work I had done is under the intellectual property of the company
Challenges
High competition in the Digital Marketing Agency space
There is a high concentration of marketing agencies of similar size to Emote Digital in the industry, and 20 main competitors were identified.
Wanted to update the website incrementally to not overload developers
Developers are always under the pump and this project isn’t their priority as it was an internal project. This would mean that the design changes had to match the budget they can work with.
Maintaining the SEO of the website
The SEO is what made this brand successful, but with that, it is very text heavy, so there were opportunities to convert content to be more visually appealing.
Solution
Conducted a competitor analysis
The full analysis will be down below. The analysis compares what the 20 other brands do to stand out and to see how far back we are from the rest.
Incorporating frontend development knowledge to designs
Using my background in frontend development, I was able to know whether a design was viable or simple to create using basic CSS styles. In doing so, it increased the likelihood of the designs being approved for development.
Focus on the company’s strengths
Keeping the content as is but incorporating other design principles to showcase the content better or sometimes to hide it to avoid user reading fatigue.
Competitor Analysis
Steps:
Create a judging criteria to analyse other websites in
Position the websites/agencies in a positioning map
Compare non-ideal and ideal websites
Identify the most unique thing from each website and decide if we want to avoid that or we want to adopt that technique
Pitch it to client
Criteria
Visual Design: Branding, Colour, Aesthetic, Spacing
Functionality: The ability to carry out intended tasks
Animation: How engaging and interactive the website is
Accessibility: The website’s ability to inform the user how to perform the intended task
Agency Positioning Map based on criteria
Final Designs
Designs from the ideation phase was discussed to find out which of the components should be prioritised as these updates were going to be done on a rolling basis.
The info cards and trusted brands section were the first to be approved as that provided the best selling point in terms of interaction and uniqueness.
From Component Design to Live Website
From Component Design to Live Website
Developer Handover
The developer document allows the developer to see what has been updated on the current website with a side by side comparison of the old and new. Comments are also added to inform them the specific states such as hovered, pressed and etc.
This project was completed before the reliance of Figma Developer mode hence I communicated the changes to developers using Frontend CSS terminology in the comments.
Example of the Developer Handover doc, that shows what was previously there and what has been changed
Learning Outcomes
How to innovate designs while still being in the constraints of the previous design system.
How to formulate and present a developer doc to a project manager
Understanding the start to finish process from when the project is handed to the company to the end point of passing off the developer the designs.
Perform effective market research on competitors in the industry
Through analysis of the individual websites and what makes them unique and effective and applying those theories to my current client
Presenting designs to stakeholders
With this aspect, practice makes perfect and during my time at Emote Digital, I had plenty of practice to present my work to my colleagues.
