Motion renders were created using Principal to show micro animations and how page elements behave. This animation was created to show the multiple levels within the mega menu.
A set of Style tiles were create to manage the rendering of all page components in our wireframes.
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/058f65fc-95bd-4d45-ade5-ea3df66f0156_rw_1200.jpg?h=7e81635eb809f957b448ea99573fe623)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/192f934e-e68e-4849-b9bc-6f1a05628f4a_rw_1200.jpg?h=15f628dd04cb47c52469c3e479d02f66)
Motion renders were created using Principal to show micro animations and how page elements behave.
Low fidelity wireframes were setup in a range of configurations to cover all required page types across the site. These were then refined for the final site structure and output.
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/60bef690-154e-4338-a34f-509f3b95dd46_rw_1920.png?h=367e4f10a1348be0acaa42c6b0a6fbdc)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/c2d1cd5c-e76b-42d1-a3c3-f204cb327297_rw_1920.png?h=61d273fee8648d3e2cf38b3eb66e2b3d)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/3f4cfd58-26a3-4ffe-b8f6-041341fd4aae_rw_1920.png?h=a4d2bade1b3f4b40a3d0283096dc7fbe)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/4d532f84-eea4-440a-8e07-a038d49dd8ff_rw_1920.png?h=d74865ede8b52add52f9519647832ffd)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/5e1e16d5-0db1-4162-9901-f6d21fe2aa24_rw_1920.png?h=4c5bf2b6bd42b78d1b1725a85efe20d0)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/a7898117-5639-4f78-8515-495d97f62d23_rw_1920.png?h=f89b29decc1ba2da7c5d09b03215e7f4)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/2cb592a7-0f4d-461b-ab7a-2c0e8a260a7c_rw_1920.png?h=8a4d5ae829bb623db3066de71a5cea56)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/0606acf8-7f16-4806-bae5-c0a5325ca856_rw_1920.png?h=4a09237ef8ea6bdb874d0d1ff52ad231)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/af11ede2-eacf-41fe-9511-5f17c5356f3d_rw_1920.png?h=3f06dc8ffd253f0291a55d55e84f4eab)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/dd910eda-c2ec-4992-9bdb-46e91d8a14fb_rw_1920.png?h=851debbf6078df1ceac3922a831fd374)
![](https://cdn.myportfolio.com/2457003115bfa2d537d7af4807a47859/196e2e50-baa3-4dac-b142-1ee81854f5dc_rw_1920.png?h=f432cde7e49945cd4094f5a4eea00041)