Worqstrap

I'm working with 2 indiehackers @qayyumrajan and @sellific; to redesign the https://t.co/2TlwfpCMJI website (pic attached) Honestly, I've been super excited about this project for a simple reason: The before/after will look amazing! 🤩 Well, that's the plan!

Like every design project, I start with wireframing my thoughts out on paper. Design has no substance without purpose. Good design follows information flows and action flows. So it's important to consider the information we care about and the actions we want the user to take.

There are several actions we care about: 1. Subscribing to the jobs newsletter (which is highly customizable) 2. Browsing jobs in the relevant category 3. Showing ads in a way that flows with the rest of the page 4. Considering where search users land 5. Mobile experience

The hard part about design is that it's an unbounded problem. You could do this 300+ different ways, and solving for the most optimal path requires a process of search/exploration and elimination. This process is often an intuitive one and not as "scientific" as I laid out.

In the next post I'll share how I go about the design exploration process. Consider giving me a follow to see how this turns out!

I've been redesigning the Worqstrap website It's a remote search job board that collects 100k+ jobs from many websites in one place. The first thing I started with was the brandmark. I wanted something that symbolizes a job search and also felt modern and simple.

For the next iteration I want to see if I can solve for the following problems based on client feedback: - Worqstrap remote jobs is a sub-product of the overall brand, so search might be limiting to the brand aesthetic. - Try out more about remote work related iconography

The current Worqstrap site looks something like this We're redesigning it The website is starting to get a ton of traffic, and there's a lot the founders @qayyumrajan and @sellific have in store for it. Here's how it's going:

Like every design project, I start with wireframing I did some on paper, but here's the figma version

At first I was heading in a neon/flat aesthetic direction but it felt wrong for the brand, so I quickly scrapped this idea

I knew I wanted bold colors for this A brand image that felt fun/approachable The opposite of corporate/serious Which is why I wanted to use a warm/bright color Blues/greens felt too serious and reds didn't seem right either. Which is why I went with a yellow palette

Continuing to work on my wireframes I landed on this

I wasn't loving the white into section as much so tried stuff like this

and this

And this

This wasn't the only direction I experimented in. There was a second, cleaner, more "swiss" style I wanted to move in. The use of a grid, type scale, clean fonts.. This exercise really helped improve the other version too — a symbiotic exercse.

Honestly, one of the layouts I really liked

This one too, I really liked the black/bold header. And the flow seemed good, but in the end I was leaning more towards the other layout.

Which is this I felt it had better visual hierarchy and just worked better and was more practical/conversion focued

Collapsing the header gives you more space

And I thought it'd be fun to do seasonal headers

Scary!

Also these had to evolve They were fine, but something was missing. I didn't like how it wasn't super easy to scan and lacked structure

I tried stuff like this Which I thought was the right direction but still needed stronger hierarchy

And this, finally made me smile I liked the "swiss" style buttons and the stronger color hierarchy which made listings easier to scan

For the footer I tried some stuff like this

and this

But the one I really liked was this A simple, grid-like structure which maximizes legibility and looks really nice

In the end I really liked this direction Practical, bold, simple.

There still some ways to go on this! Tweaking things that are important from a business goals/vision perspective. Solving for flows that haven't been addressed. But I'm quite pleased with the pieces that have come together!

Another round of iteration and we've nailed some of details 1. Like the Post A Job CTA 2. The inline Newsletter configuration

- Added a "more categories" section to list our various combos of job types - Better CTA's like (view 4+ finance jobs) - Companies hiring remotely (another way to find jobs)

And a slick new footer!

Also the main header can be collapsed so regular users don't have to scroll too much before seeing the jobs!

Honestly, really loving how this project turned out! Gonna share how the company landing tuned out in a few days too, stay tuned for that. s

Before -> After I've been working with @qayyumrajan and @sellific to redesign the Worqstrap platform Honestly, I'm just crazy excited to see this stuff go live. It's going to be awesome! This was a crazy journey, but it's amazing how far the designs have come so quickly.