Art Direction / UX Design / UI Design

2020

A money magazine for people who care about more than money. Conversations with geniuses and weirdos, help with investing and taxes, and stories that help you understand the big strange world we live in.



The Challenge

At Wealthsimple, we needed to migrate our high-quality money magazine to a new platform, and we saw an opportunity for a complete, long-overdue design overhaul. The goals of the new design was to elevate our high-quality content and make the stories the hero. We alsowanted the new Magazine to be a clean and calm environment to be in, a destination that seeks to demystify the scariness of money. Thirdly, we put extra emphasis on conversion from content consumer to client, and on creating better analytics about our conversion funnel.

The Design


<style>

.video-container { margin: 0 auto 0 !important; max-width: 70% !important; }

.embed-container-first { position: relative; padding-bottom: 50%; height: 0; overflow: hidden; box-shadow: 0 10px 40px 0 rgba(0,0,0,0.08);}

.embed-container-first iframe, .embed-container-first object, .embed-container-first embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>

<div class='video-container'><div class='embed-container-first'><iframe src='https://player.vimeo.com/video/437531047?autoplay=1&loop=1&autopause=0&background=1&quality=1080p' frameborder='0'></iframe></div></div>

<style>

.video-container { margin: 0 auto 0 !important; max-width: 70% !important; }

.embed-container-first iframe, .embed-container-first object, .embed-container-first embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>

<div class='video-container'><div class='embed-container-first'><iframe src='https://player.vimeo.com/video/437531110?autoplay=1&loop=1&autopause=0&background=1&quality=1080p' frameborder='0'></iframe></div></div>


<style>

.video-container { margin: 0 auto 0 !important; max-width: 70% !important; }

.embed-container-first iframe, .embed-container-first object, .embed-container-first embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>

<div class='video-container'><div class='embed-container-first'><iframe src='https://player.vimeo.com/video/437531125?autoplay=1&loop=1&autopause=0&background=1&quality=1080p' frameborder='0'></iframe></div></div>

<style>

.video-container { margin: 0 auto 0 !important; max-width: 70% !important; }

.embed-container-first iframe, .embed-container-first object, .embed-container-first embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>

<div class='video-container'><div class='embed-container-first'><iframe src='https://player.vimeo.com/video/438050760?autoplay=1&loop=1&autopause=0&background=1&quality=1080p' frameborder='0'></iframe></div></div>