Pinnacle Partners is a an offering to companies to partner with them in the online gaming industry. As one of the subsidiary, stand-alone pages explaining what Pinnacle can offer, management felt an update was required to feel more engaging to the user than what currently is in production. The outcome being that there's an increase in the number of click-through rates and partnerships made. However due to time and resource restraints, the copy the overall structure was to remain the same.
Understanding the requirements, I started off by analysing the current page to see what small improvements could be made to create better user engagement.
Pinnacle's default aesthetic is a light colour scheme and the current Pinnacle Partners design reflects that of the Sportsbook. However the page felt like it would benefit from a different approach if the alternate dark mode colour scheme (also found in the Sportsbook and the header) was applied. By utilising the alternative dark colours, the imagery and colours would stand out more, including the ever-important call to action buttons. This would also make the header look like it extended into the page, contributing to a more open and modern look. Additionally the backgrounds of each sections could be unified to give the page more flow and feel less blocky. The use of fewer solid colours and more gradient use could be applied to visually enhance the pages' elements.
Font sizes were something that could be reduced as well as reducing the number of sizes used. All these considerations would hopefully add up to create a more engaging design with a a greater consistency running throughout the design.
Early iteration of the Pinnacle Partners page
For the redesign I started off by applying the same gradient as the header to the page's background colour and then looked at what coud be done to the hero section. The aforementioned font sizes were reduced and a change in imagery was made. Looking at the polygon style found in the 'Partnerships at Pinnacle' section, it seemed appropriate to extend this same style to the hero image. Applying a circular gradient behind the image gave more depth to the design and also set the precedent with regards to styling. The CTAs and title lines adopted the same approach but used a linear gradient.
The 'Partnerships at Pinnacle' section saw amendments to the font sizes and position of the content indicator function. This improved the information hierarchy and readability of the content. The treatment of imagery here mirrored that of the hero image for consistency and to drive the design's theme.
Each of the existing partners in the 'Featured Partners' section felt like it needed individual containers within the open look of the page. Updating the text links to secondary CTAs felt appropriate as it gave the links more prominence. On mobile a horizontal scroll of these cards was proposed, rather than the usual stacked approach, further adding to the modern aesthetic of the design.
The 'Other Partners' section proposed the use of a carousel to entice user engagement. Focusing on one partner at a time would help achieve this and gave an opportunity to apply the circular gradient theme. On mobile this section would also utilise carousel functionality to reflect the desktop counterpart.
Lastly a unification of font sizes and the application of the dark colour scheme and gradients across the 'Contact Us' and 'Frequently Asked Questions' section. As this was the main functionality of the page, no further amendments were carried out. During the course of the redesign, considerations towards accessibility were made. These included, but not limited to, font sizes and their legibility across screen resolutions, contrast in foreground and background colours and whether they met WebAIM standards, the contact us form fields contained clear, readable labels and the adherence to a clear visual hierarchy of page sections and elements.
Development and Usability Testing.
Upon completion of the design and a presentation to management, the design was met with positive feedback and the proposed functionality changes were approved. Assets and supporting documentation were then prepared and sent to the Development Team. The project hasn't gone into development yet but when the page is live, the KPIs will be measured and compared to current iteration in the form of an A/B test. The results of which would be analysed to provide an insight into the success of the page's redesign. When the initial development of the redesign had concluded, I would put forth a Front End Review to 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. Upon processing the changes, the page would ready to be published.
Further to this I would also request that user/partner feedback is acquired and analysed to explore the level of user engagement and impact the redesign has had. This would also allow any pain points to be discovered as well as look at any potential UX/UI suggestions. Ideally a large sample of users/partners would be used to give a better insight and reduce any bias. This analysis would help determine whether the redesign was a success and what further improvements could be made before the launch of the page.