Why Pinnacle
The Brief.
Why Pinnacle is situated within Pinnacle's site as one of the corporate pages, designed to entice visitors to use Pinnacle's products. It highlights the company's USPs, additional information regarding their offering and provides testimonials. The graphic style for the company's creative imagery was recently updated, which provided an opportunity to incorporate this new style into the redesign. Free-reign was given with regards to the current design's structure on a conceptual basis, to explore the bounds of Pinnacle's branding. Of course the redesign had to remain consistent to the core branding principles but this exercise gave the chance to utilise UI elements from other design update projects.
UI Conceptualisation.
The current design employs a mixture of light and dark colour schemes, reflecting that of the Sportsbook's colour modes. Deciding to opt for a unified colour scheme felt like an appropriate step to take and explored how the 'dark mode' colour scheme could be applied. Assessing other areas of the page revealed that there were other structural and stylistic improvements that could be made. The information hierarchy needed revisiting to employ a more natural flow to the page. The 'Why Pinnacle' section felt awkward to use, not only in its vertical carousel functionality but also in its placement of content. The testimonials section, often seen as a great area for advertising the business, felt lacking in excitement and its ability to entice the user to interact and read more reviews. The layout had less of an 'open' feel compared to that of the other sections situated above it.
Early iteration of the Why Pinnacle page
Analysing other areas across the website such as landing and partnership pages, with the addition of the new graphic style, began to influence the theme of the design.
Adopting a left aligned, stacked orientation for both the titles and supplementary information would help increase readability amongst users, this would be also true of the desktop version. An image with the new graphic style would occupy the space opposite the title and USPs in the style of a container card. A stacked approach here would be applied to mobile also. The header would remain sticky so that the language selection and 'Join' CTA are always available to the user. The data inflections on the background image provided a texture for the UI. It would also help drive the notion of sports information as well as betting measurements and would be placed throughout the page's design. A usability test here could be implemented to understand what the initial impressions of the page were and uncover whether the hero design created an engaging introduction to the brand.
​
Running with the precedent set in the hero, the Why Pinnacle section utilises the left-aligned, vertical orientation of content for both mobile and desktop versions. Changes were made to the existing carousel functionality whereby it was made more obvious to the user that there was more information to engage with. The imagery on the left would change accordingly when the next slide in the carousel was selected, whilst maintaining the container card style.
​
For the last section on the page, the testimonials adopted a horizontal orientation. I had used a vertical orientation for the previous sections however, the layout of content and structure of the page felt too repetitive, especially on mobile. Breaking convention here and opting for a horizontal alignment felt more engaging and provided a clean end to the page, with the footer residing underneath. Another plus point for using this type of orientation meant consistency with the Pinnacle Partners page functionality was maintained. Additionally, it meant the three testimonials could be seen (though focusing on the middle quote) as opposed to the original two. Throughout the design of the Why Pinnacle page, considerations towards accessibility were made. These pertained to font sizes and their legibility across screen resolutions, contrast in colours across elements and whether they met WebAIM standards and the adherence to a clear visual hierarchy of page sections and elements to convey how we wanted the users to perceive and use the interface.
Development and Usability Testing.
Should the design be approved, I would request that we test the concept on a mixture of users and stakeholders and gather data for analysis to uncover whether it met both user and business needs respectively. I would conduct usability tests to determine whether this design created excitement, felt compelling in its approach to branding and felt usable with the proposed functionality. I would also want to discover whether the page felt useful and informed the user of Pinnacle's values and benefits. An A/B test could be implemented after the development of the page to measure the conversion rate and interactions between the current and revised designs amongst users. The results of which would be analysed to provide an insight into the success of the page's redesign and where improvements could be made.
Assets, imagery and a style guide would be prepared for the handover to the Development Team and a Q&A session would be offered. Once development had been completed in a testing environment (whilst acting as a consultant to the Dev Team throughout the build), further usability testing would ideally be carried out to determine how the design faired amongst users when interaction with functionality could occur. Additionally I would put forth that a Front End Review should be conducted; whereby I would review the design on screen, cross reference this with the UI and suggest amendments to the developers to ensure what's been signed off matches what's on screen. After the amendments had been made, the page would be ready to go live and a social post be created by the Content Team, further promoting Pinnacle and its updated branding.