Redesign an existing corporate website for Publix. Conduct eye-tracking tests to determine where the user’s eye went and stayed. Use eye-tracking data to verify and improve the design.
Publix’s existing corporate website features a non-responsive outdated layout, with the main colors being the Publix green and various grey colors, making it feel dark and ominous. Small low-resolution images are used
on the site, making it feel unprofessional. On the existing home page, a prominent alert is seen, although important it gives the wrong message to investors. The redesign concept features the bright cheerful Publix green against a white background offering good contrast. It features a streamlined design with large banner images that invite the user in. Eye-tracking was tested on users to determine where the eye went on the home page and the our story page. The results of the eye-tracking showed users’ eyes moved in a triangle movement between the logo, banner image, and overlay text on the image. These results verified that the users’ eyes went where the most important information was. Eight pages were prototyped in Adobe XD, and then further developed using HTML and CSS. To view the coded version of this project click here.