Performing a dramatic website design ‘facelift’ for Toronto’s most successful plastic surgery clinic.
The Plastic Surgery Clinic is Toronto’s most notable and well regarding plastic surgery clinic without refute. With such an elite status comes unparalleled attention to detail, honest scrutiny and the requirement for incredible design and technical skill. In 2017, on the recommendation of The Plastic Surgery Clinic’s well-regarded SEO expert, Parachute Design was invited to submit a website design and development proposal to undertake a complete digital rebranding and technical overhaul of their tired and ageing website.
Following a few phone conferences and detailed sit-down meeting to review our proposal, PSC agreed to put their trust in our Toronto web design company to begin working with their internal marketing team and SEO expert to design and develop a brand new website.
Determining Our Website Design Goals
- A complete analysis and revamping of the website user experience – PSC had enjoyed high exposure for many years due to the sheer quality of their detailed website content. However, with recent changes to Google’s search index algorithm and the rise of mobile website design, it was time to revaluation the website analytics and apply a new website design and conversion strategy.
- A total website user interface redesign –our initial website analytics discovery and strategy work lead to a dramatic restructuring of the website’s navigation and content architecture all carefully woven into a new responsive website user interface design to engage the mobile audience that was previously ignored.
- Custom WordPress development – to allow PSC total control over managing their vast and varying website content elements and to support their substantial investment in search engine optimization and marketing a custom-tailored WordPress solution was required.
- Refined conversion strategy – our ultimate and most measurable goal within the website design overhaul was to entice more visitors to complete a ‘request for information’ or ‘book a free consultation’ form.
- Development of a new payment gateway – in a very forward-thinking move, PSC planned to include a secure e-commerce element to the new website to allow patients to pre-pay for their plastic surgery procedures online in advance.
- Implementation and support of their heavy SEO investment – working side by side with PSC’s established search engine optimization professional, we carefully planned a new website design, content and conversion strategy to enhance the website’s performance.
Our Web Design Process
Our initial discovery work was somewhat unique with PSC compared to most other clients we’ve worked with previously. The original website featured such a vast library of content, both in-depth articles and multimedia that was already performing quite well regarding search engine optimization. In a scenario such as this, it’s imperative that our web designers and developers have extensive knowledge of the content, sitemap and current SEO activities happening within the website and ongoing search engine marketing plan.
As with all our website design projects, we began with our kickoff meeting, followed by our notable questionnaire to get both teams acquainted and sharing thoughts and personal vision for the website going forward. Through this experience, both teams are able to become more comfortable with one another, and our creative team is able to begin compiling feedback and direction for the strategy and website UI design phase to follow.
At this early stage in the project, our Toronto web design firm was granted access to PSC’s Google Analytics profile to begin studying the existing analytics to identify traffic sources, current user experience pain points and drop offs. The analytics information is crucial to understanding how website visitors are currently finding and engaging with the original website and what areas of the user experience we can improve upon to offer an even better experience for our client’s audience as well as organic search performance.
Web Design Strategy
Following our discovery phase with PSC, we moved on to the strategy element of the project. This phase is where everyone starts seeing the foundation of the new website come to life. We begin with a site mapping exercise that helps to understand where all of the content will live on the new website and how each section and page will link to each other concerning our revitalised navigational experience. The revamping of the sitemap is almost entirely born from our findings in the website analytics history. Site mapping is our opportunity to bring content forward that is currently experiencing little or less-than-desired exposure as well as address notable drop-offs in the user flow that often lead to inflated bounce rates.
Following approval of the new website map, our creative website designers sunk their teeth into wireframing. The wireframing stage is where everything starts to get real for our clients. Based on a combination of our extensive discovery work and years of experience to understand how information should be presented to different audiences and in different environments, we begin building a physical blueprint of the new website. Wireframing is our opportunity to explore ideas for page architecture and how information will be prioritised on the new website. All of these elements are woven together to create the new and improved user flow and conversion strategy that has slowly come together since establishing our initial goals for the website. Essentially wireframing is a clear plan of how our web design team plans to achieve the measurable objectives.
To provide PSC with the most accurate and life-like experience of our website design strategy, we shared the wireframe design in our online prototyping tool to allow everyone to click through and browse the wireframes as they would a typical website. Within the prototyping tool, PSC team members could markup, draw on or leave detailed comments right on the wireframes for our design team to review and act on right away. Over the years we’ve found this level of engagement offers our clients a much more thorough understanding of our web design strategy and keeps everyone accountable and involved in the decision making process. Perhaps most the beneficial aspect of this process is a significant decrease in the number of design revisions needed to finalise the creative UI work to follow. Ultimately, this saves time, money and results in better-finished website design.
Creative Website User Interface Design
Following official sign-off on the new website wireframes, we were ready to move on to creative design. This phase is where everyone begins to get excited and see the fruits of our weeks of discovery and strategy work.
Our Toronto web designers took the wireframes and worked up a brand new user interface concept that was designed to command attention and communicate PSC’s message and service offerings. PSC offered our team a fantastic opportunity to work with a very unique and bold colour palette paired with strong, beautiful imagery and the results really do speak for themselves. The messaging is crystal clear, and the continuous branding commands anyone’s attention, even at a glance.
Throughout the creative process, the overall design of the new page templates was amazingly smooth and well received by PSC and their SEO advisor. With our new visual direction firmly established our web designers set their sites on what we anticipated to be the most significant design challenge within this project – the amount of page content and supporting media.
Traditionally, both sides of the design/SEO table will debate the ideal length of page content. Ultimately, there’s no convincing either side they’re incorrect, but we don’t believe either side is right or wrong when it boils down to results. As a designer, our job is to ensure the page content is presented in a way that is visually appealing to the user and encourages them to read and later take action by completing a form or clicking a button. An SEO specialist will push for longer page content thinking only about how appealing the page will appear to ‘machines’ such as Google’s crawlers, often without regard for user experience. In this project, we were fortunate to work with an SEO that was extremely knowledgeable and realistic when it came to web design and SEO, and how they can work together to offer the best possible results. Similar to our own belief, the SEO agreed that a marriage of bespoke website design along with in-depth content would deliver the results that PSC was seeking. Through this collaboration, we created an experience that featured embedded anchor navigation to easily handle the lengthy articles and procedure pages and broke this content up into reasonable size pieces by placing supporting videos, photo galleries or graphics throughout.
Mobile Website Design
Until 2018 PSC was unable to provide much in the way of mobile experience to their audience, which was identified as a critical goal for the new website design early on. Upon entering the mobile playing field our approach was to offer a seamless experience for users across desktop, tablet and mobile environments understanding that most of the target audience would make initial contact on one device, but later follow up and convert from another device when time allowed. This type of browsing behaviour is becoming increasingly more common among many industries and really drives home the necessity for a truly responsive website design and user experience for any website.
As we presented PSC with the wireframes and desktop website interface using our prototyping tool, we also presented the mobile interface design in full context to allow our client to understand, experience and thoroughly absorb the brand new mobile experience. Given that PSC had never had a mobile website offering previously, we believed it was important for decision makers to interact with the mobile menu and user interface in context to ensure they were one hundred per cent onboard with our mobile design strategy and understand how the mobile experience differs from the traditional desktop environment.
With the approval of the mobile web design, our design team packaged up the final artwork to be pushed over to our highly skilled WordPress web developers to begin building the new website.
Custom WordPress Website Development
With the website development stage in full swing, PSC was able to divert some attention back to their day-to-day marketing efforts and begin prepping their website content for delivery to our team. Communication during this phase tends to slow to a whisper while our developers work away on bringing the beautiful new website design to life.
What makes Parachute so successful in the website design community is the collaboration and trust we nurture between our creative and development teams. Many firms will employ front-end designers/developers and rely on back-end developers to join the project later to merely implement the functionality. Our Toronto web design agency is different. Our development team is fully engaged in every website design project right from the strategy phase through deployment. Our WordPress developers join the decision-making process throughout wireframing and design to ensure that all ideas are considered before moving on to the development and to virtually eliminate any unforeseen scenarios where design may not be achievable due to a technical obstacle.
With our approach on the table, our professional WordPress developers were able to provide insight and direction early on in the project. This level of involvement offers solutions that allowed our web designers to create the anchored sub-navigation experience so heavily relied upon within the lengthy procedure pages as well as plan ahead for and create the easy-to-use backend tools for the website admin to manage dynamic featured content throughout the website.
Our skilled web developers also had an opportunity to showcase their talents during beta testing and content entry. Working side by side with PSC’s SEO specialist, we identified potential SEO pitfalls in the automatic URL structure within WordPress given the nature of the content offered in The Plastic Surgery Clinic’s website. For example, many procedure pages discussed a specific topic that was repeated throughout the website in blog articles, events and photo or video galleries. As the SEO specialist identified this potential duplicate content issue early, our development team was able to create a custom function within WordPress that would automatically write the appropriate canonical URL to mitigate any such problem automatically and without any effort at all by the website administration.
As the web development phase progressed into its final stage, our content entry experts took the reigns and also worked side-by-side with the SEO professional to ensure all content was entered correctly and met the stringent SEO requirements to maintain PSC’s existing website rankings.
Once the new site had been thoroughly tested, we had a green light for launch. Working together with PSC’s SEO and IT people, we quickly migrated the new website to the staging server on the brand new managed WordPress hosting platform recommended by both our design team and the SEO pro. Following a thorough round of testing by all parties and with confidence that the website was stable and passed all prelaunch checks, we rolled the new website out to production without a glitch.
With just about every new website deployment we urge our clients to take on a ‘soft launch’ approach. This deployment method allows the website a day or two to run on the new web server and entirely cache before any marketing efforts to draw attention. This practice gives our web design team the ability to monitor the new site for efficiency and if need be correct any last minute issues before shining a spotlight on the new website for the public.
WordPress CMS Training and SEO Best Practices
The final phase in our website design overhaul for PSC was the ceremonial handing over of the keys. At this time we invite our clients to participate in a screen share conference to demo the new content management system and learn how all the new tools and features work together to simplify the day-to-day management of the new website. During this meeting, we also provide content development insight and general best practices for daily SEO work required when publishing new content to the website.
About Parachute Design
Since 2003 Parachute Design has set the standard in medical and healthcare website design in Toronto. Our professional web designers and developers have the experience and know-how to custom tailor a solution to meet clients’ unique needs. If you’re in search of a detailed web design quote for your medical clinic or business, call our Toronto web design company at 416-901-8633 or complete our online proposal planner.