Wealth Awesome

So excited to be working with @qayyumrajan again, this time redesigning @WealthAwesome . Wealth Awesome is a data-backed resource for Canadians to grow their wealth. It gets 50k+ users a month and it's time it gets a facelift. This is what the current website looks like!

It's kinda bland, but does the job. We're gonna be taking it a level up. If you wanna see how this turns out, follow me! And if you're interested in taking your website up another level, hit me up in the DMs!

@qayyumrajan @WealthAwesome You bet!

An update on the @WealthAwesome design project: After a kickoff with a design client, the first thing I do is set the tone for the project This is usually very high level A few notes on design direction and a mood board This is the mood board I did for WealthAwesome

I usually start with notes on the project to understand what the business model is and what the overall goals are For WealthAwesome, a website that gets 50k+ uniques, targeting Canadians on their financial journey, I knew there were certain themes that will be important

Their business model will heavily rely on Ads, Affiliates and Subscriptions. And the website is a data + editorial mix that helps everyday investors find the best credit cards, mortgages, loans, stocks, etfs, etc Used by mostly 25-54 year olds, which seems about right.

We knew we want to be serious, but not like Bloomberg or Financial Times serious. A bit relaxed, but not Milk Road relaxed. The crypto scene I'd wager attracts a younger audience. So we're going for a friendly tone, but also trustworthy and intelligent. ie. "brand voice".

Immediately, I'm thinking: - Swiss Design - Red on gray - Large bold sans-serif - Vertical grid lines - Large-ish Serif body copy - Canadian symbolism - Trees, mountains, forrest, snow - Graphite, blue, lines, grid

Now we've got a bit of a starting point Those words, are already painting a picture in my head But we can't ship my imagination now can we? It's time to roll into Figma and see if my ideas can be turned into a design direction!

Stay tuned if you wanna see what the design direction turns out! I'm taking on more design projects in April, DM me if you like my work and process!

@tholder @WealthAwesome Plenty of brands use red successfully — like SwissAir, ScotiaBank, Canada CIC, HSBC, UBS, etc But I think you're right in that red is a more challenging color to use for this use case.

@tholder @WealthAwesome Haha fair, the Swiss def own red, but I'd say Canada kinda owns a little red too. And this client's focus is 100% Canadian finance.

I'm redesigning @WealthAwesome for @qayyumrajan And I'm sharing the design process! We finished moodboarding in our last step, now we're thinking about colors and fonts The keywords we're thing about are: Finance, Canada, Friendly, Corporate, Authoritative

I spent some type picking colors that I thought would work well together. We may or may not use them, but with bespoke projects like this, we're trying to stand out, and it helps to think from first principles about the basics like colors, grids and typography

For the fonts, I wanted a Geometric font for the Headings and a very readable, approachable Humanist style font for the body copy. Here is a paring I really liked, Geologica and Rosario. I realize the letter width is a bit wider on Geologica than on Rosario but it still worked

What the hell is a Humanist font anyways? Well, imagine letters that feel like they were written by a pen—warm, approachable, and super‑legible on screens. If Geometric is a ruler‑straight grid, Humanist is a handwritten note from a friend.

That's all for today, tomorrow we'll tackle the logo!

Next on @WealthAwesome we're redesigning the logo. I'm not a logo designer by any means, but as you can see the logo on the left (current) is pretty poor and we can probably do a little better. After thinking about some symbols we could use, I quickly settled on a "mountain"..

A mountain as a symbol works quite well. WealthAwesome helps Canadians with their personal finances. Vancouver, where I'm designing this for instance, is surrounded by mountains, is very inspirational. But also, climbing a mountain feels like an apt metaphor for this product.

Whats funny is that, after all the experimenting and trying out various combos, the one I liked the most was an iteration of something I started out with. The top left one. I think the logo works really well for this use case and I'll share how I ended up using it tomorrow!

This is the one we eventually went with. I'll share how we end up using this in the design tomorrow!

The first iteration for @WealthAwesome I wanted to try one of the bolder palettes with our logo. This is a bold blueish-purple with colder grays for the featured logos. I quite like this but..

I'm really liking it, but, as a designer I feel like I have more in the tank, like this isn't the most optimal design I can come up with. So we're gonna give it another iteration and where we can take this!

This is the ugly truth of the design process, you just have to keep on iterating until you find a version you like. And have faith that you'll get there, even when you are not there yet and have clue if you'll ever get to a version you'll love.

This is an update on the design process for @qayyumrajan who runs @WealthAwesome The last iteration was interesting (posted yesterday), but I didn't like how the sections looked. They were lacking something...

Maybe the scale of the typography wasn't right, or the hierarchy of information. Maybe it was the grid or the colors, but I was just unhappy with it. I knew I had to keep on experimenting. So I went back to the drawing board and started thinking from square one again.

This time I wanted to lean in on the Swiss design style. A very strong grid. Maybe the grid even reveals itself to the user. I wanted bold colors, but also sophistication in their use, which I felt was lacking in the last iteration.

I also had an idea which I think worked REALLY well. The idea was to create these "responsive blocks" of data or content. This personal finance website is a data+editorial website and the hard part was trying to map out how all the information should be presented to the user.

The concept of "responsive blocks" is something I've had many years ago when I launched Responsive Elements. And this is a similar idea. https://t.co/WJtd3FojAx

The idea is that every section or piece of data or content may need to shown many times on different pages So by having these reusable building blocks, we can make very complex web pages with lots of data & content, but also keeping the design and development process manageable.

This design has come out even better than I expected. The swiss design style works exceptionally well for this personal finance brand. The red is bold, but not overwhelming. The sections flow beautifully, and the design looks clean and authoritative.

I think this will be a fresh start for Wealth Awesome and can't wait to see how far they take this brand. I'm taking on more projects in June. Happy to get on a call and show you some of my past work if you're interested. DMs open.

I learned something interesting from @qayyumrajan Don't just say "Signup to the newsletter" Instead, offer something of value that they get when they first signup. And it'll convert a lot better! That's why Wealth Awesome has the biggest lead magnet "7 stocks to buy.."

The footer is an opportunity I'll ask for the email, again. I'll give them a sitemap, which helps the user explore the rest of the website. Just little details to increase: - newsletter signups - time on site - pages viewed Make sure your footer isn't just a copyright notice.

The detail page came out great for @WealthAwesome For those who don't know, Wealth Awesome is a personal finance website for Canadians. The client Qayyum Rajan, CFA loved how these turned out and honestly I really think this is some of my favorite work ever.

I love the Swiss design style, and while I've learned from that style and used some version of it all of my work, whether it's strong grids, bold colors or crisp type, this one really excels at all of those.

The design system also works like "lego blocks" so it'll work really well into the future, even with new content and features that we cannot anticipate today!

Working on a stock summary page for WealthAwesome, what do you think?