Trinity College Dublin Homepage
As Lead digital designer, I was given the responsibility of leading the new design through the entire process, from initial wireframing to the completed design you see here.
Through extensive research, we collated and analysed the key items for inclusion and their order of importance for both the colleges’ requirements and the expectations of its audiences.
- Trinity College Dublin
- Education
- Product design
- www.tcd.ie
Armed with this data and with approval from senior Board, I mapped out a series of wireframes and flows for the page. When satisfied with the progress of the page, I produced a series of mid res mockups to help guide the direction and tease out any visual and priority issues that we came across.
From the outset, the homepage was designed and built in a modular mobile-first approach.
As this sits over several hundred individual websites within the collegeand the previous navigation systems were disjointed throughout the sites on the college network.
We set to work firstly on creating a unified navigation solution that could carry across all websites and the homepage became the sandbox to test and build this.
Moving on from the navigation we prioritised the key elements needed on the homepage and began work on designing these and building them as responsive and modular sections.
We looked at various colour options to complement the branding Trinity Blue and refined these down to a palette that evokes professionalism, integrity and classic timelessness. This was complemented by a selection of clear typography choices to help augment the college’s design aesthetic.
With the layout decided, I began work on applying the style and design vision into the individual modules. Handing finished designs over to the developers the page quickly began to take shape.
A rigorous set of testing checks were conducted across a range of devices to establish a consistent display and ensuring the site was compliant for both accessibility and responsiveness.
Travel Buddy PWA App
Travel Buddy is a post car hire booking product and is the first in-house product being built as a PWA (Progressive Web App) by the company.
This app offers users the ability to access their booking and any further information they may require about the car, pick up/drop off, directions from the airport, policies, tips, and locations whether offline or online.
- CarTrawler
- Software, App design
- Product lead
- Aug 30th, 2019
Once the analysis and various kickoff workshops gained traction, I set to work on presenting the findings and laying out the mid-res wireframing. After approval and signoff from stakeholders and management, this was then moved into the production of high-res designs on a component basis, to design for adaptability in 42 languages and the need for flexibility across devices.
My first task was to liaise with the stakeholders, discuss the brief set, and analyse and audit the work completed to date.
From here I presented the findings and delivered a user flow for the product. Following fine-tuning, the project was moved into prototyping mid -res states of key screens.
After approval and signoff from stakeholders and management, this was then moved into the production of high-res designs for the entire product with its various flow states fully realised.
A working prototype was delivered to facilitate the handover to the developers. Assets were collated and redrawn to SVG format where needed.
To aid and complement the presentation for marketing I built an animated mockup of how a certain key function of the product would work, along with developing a suite of iconography, mood boards and colour charts.
I developed a scalable JSON animation of the logo, which was integrated into the loading state within the current app build.
The designed product was delivered into the development pipeline in the ticketed timeframe.
CarTrawler CMS
The NextGen Landing Pages were a CMS project set up to build modular, generic and scalable components that would be quick to deploy across both B2C and B2B partners in a variety of templated themes. Ensuring that a robust and quick-to-market solution was built using a Mobile First approach was of paramount importance to the stakeholders.
Our task from the outset was to explore and devise a redesign of the in-house B2C brands landing page. To deliver a series of modular and flexible landing pages, that would convert easily to PPC and SEO campaigns where needed. This would also serve as the sandbox for the bigger project of templates for the B2B partners.
As Lead Designer, my key tasks were to audit the current range of landing pages, liaise with the research team on findings, produce mid res wireframes, high res prototypes, user flows and develop a grid system to tie together the Design and Development deliverables.
- CarTrawler
- Software, CMS
- Product lead
- Sept 4th, 2019
Once the analysis and various kickoff workshops gained traction, I set to work on presenting the findings and discussing the project with the development team to ascertain and flag any issues that we may need to be aware of from the start. Following this, I began laying out the mid-res wireframing in a series of steps.
After approval and signoff from stakeholders and management, this was then moved into the production of high-res designs on a component basis, ensuring the flex for adaptability in 42 languages and responsive display across devices.
As Next Generation Landing Pages are quick to deploy and easily maintainable, partner managers can build as many pages as needed using this rapid deployment model.
The preconfigured templates are available to all the companies partners as a jump-off to capturing their audience’s attention in the best possible way. Offering effective market-tested templates whether it be luxury, low fare, customer-focused, or budget audiences.
Through a series of refinement sessions, the components were finalised and handed over to the development team through a series of handover sessions.
We began moving the design out of the sandbox state and into a workable white-label version. It was decided then to test the speed of production and integrate 3 partners through the CMS – Top Tier airline, Low Fares Airline and a Car Hire partner.
Wrapping up I supplied handover documentation and conducted onboarding sessions with the Design Team to aid the future phase rollouts for the project.