May 22, 2021No Comments

Figma grid starter kit for Semplice

I’ve been using the Semplice theme for the last few years for this website. It’s intuitive and isn’t weighed down like most WordPress builders.

An unintuitive part of Semplice is the custom grid system. It's not clear how padding settings work, so it's difficult to predict how they will look. Until now :)

I create a Figma kit for Semplice with grid styles that match Semplice's grid system. This makes it easy for Figma / Semplice users to create accurate layouts.
My kit uses a double-grid system. The hairline guides are column breakpoints and the thick guides are gutters:

  • use gutter guides for content
  • use hairline guides for column background colors

You can find my kit in the Figma Community

Read more

April 20, 2021No Comments

Whiteboards & Stickies: variants remix

Whiteboards & Stickies is the most popular stickies project in the Figma community. The stickies look amazing and are built using auto-layout, but they didn't go so far as to use components, let alone variants. With Config coming soon, I decided to give back to the community by remixing the kit to use variants and a few extra features.

Check it out here!

January 9, 2021No Comments

Obvious: wireframe prototyping

I’ve been having a lot of fun building interactive prototypes for Obvious, my activity journal app. Two of my prototypes are guided walkthroughs of the Timer and Journal sections. The third is a heavily-wired simulation of cycling through a set of work sessions and breaks using a working (but truncated) Pomodoro timer.

Read more

January 8, 2021No Comments

Obvious: wireframes

I recently completed my second round of wireframes for my Productivity Log app [update: now named Obvious].

In the first round, the goal was to take the layout of my Mac prototype and translate it to the iPhone and iPad. This time, I had to expand my scope and resolve everything I could figure out with wireframes so I could move on to high-fidelity designs.

The biggest difference this time was how to organize entries. This organization would determine my layout components and data models. I also had to be able to explain how my new timers work, along with other user settings I needed for an MVP. Finally, I needed to layout mundane stuff like signing up, editing entries, and error states.

Let’s take a look.

Read more

October 22, 2020No Comments

Productivity log: multiplatform wireframes

My productivity app is coming along, albeit slowly. There have been some significant changes behind the scenes which have required some ramp up before I could move forward.

This post is mostly a progress report to talk about changes I made a while ago to the Mac app prototype and to show some initial wireframes for iOS, iPad, and macOS. I also have a Figma prototype I put together to show how the timer screen would work on iPhones.

Let's dig in!

Read more