Whether or not you’re a seasoned designer, choosing a UI font can be a daunting task. As of writing this, Google Fonts alone has 997 families. You might think picking a font is mostly an exercise in preferences, but there are less subjective criteria that you should always be on the lookout for.


Portfolio advice to a younger self.

1. Your portfolio will get you an interview, not a job

The role of your portfolio (and resume) is to get you an interview. Your work should stand on its own, but it shouldn’t include an 8-page case study. Save your detailed process and trove of artifacts to review onsite.

2. Unsolicited redesigns are OK

Junior designers often don’t have a lot of client projects in their portfolio. It’s OK to supplement these with a couple unsolicited redesigns. I’d recommend a product you already use but have some issue with. Take a look at one I did awhile back or find more here on Medium.

3. Your portfolio should reflect what you want to do

Your portfolio should reflect the work you want to do. It…


PWA task app Trackybara

With Firebase’s new Firestore for offline support

In case you haven’t heard, Progressive Web Apps (PWAs) are finally ready for prime time.

It might not yet be obvious to many people how to install a PWA, but if you’ve done it once you won’t forget it and it’s simpler than using an app store.

There are many reasons to start building PWAs and converting current responsive web apps, including:

  • A truly native looking and feel: Your…


My role as a hybrid designer and front-end engineer gives me a unique opportunity to see how the sausage is both designed and made. Our process at Perficient Digital Labs varies by project, but is often:

  • 💡 Brainstorm and ✏️ draw potential solutions
  • 🖥 Create wireframes and mockups in Sketch
  • 🤹‍ Bring these to life with prototypes in InVision
  • 🤓 Code a refined prototype or production app in Angular or React

This workflow always involves a handoff from designers to front-end developers, sometimes several if we’re working in an iterative sprint style…


Do your eyes glaze over at the mention of an API? Have no idea if cookies are good, bad, or just delicious?

Web development is complicated. And there’s a lot of confusing terminology surrounding it. So here’s a short list of concepts, tools, and languages written in plain English for designers, project managers, and other non-tech folk.

This is primarily for those who want to become more comfortable talking about web tech and to developers. If you want to learn how to code, take a look at this extensive guide.

The Basics

Web apps
Run in a browser (Chrome, Safari, etc.) on your…


A blank page is less intimidating than a blank screen

My urge is often to start wireframing in Sketch. But even if you’re keeping things simple — only using basic shapes and grayscale — pencil on paper is a better place to start.

Sketching comes easier to some. If you like drawing, it’s instinctual to start there. But I’ve never drawn for fun and certainly am not skilled at it.

None of that matters. Sketching allows you to produce designs faster than a computer. More speed prevents second-guessing your ideas and leads to more unique concepts and thorough exploration.

Best of all, you don’t have to show these incomprehensible scrawls to anyone. You can always tidy up your ideas later using Sketch.

The idea of starting with paper isn’t new, but it’s important enough to reread until you actually start believing it.


What we learned making a bot that talks like a person

It’s 12:30pm at Truth Labs which means we’re standing outside trying to decide where to go for lunch. We’re a creative bunch, so this seemed like a problem we should be able to solve. And a perfect opportunity to take a shot at experimenting with conversational UIs.

First, some terminology

Graphical user interfaces (GUIs) are a visual way to interact with a device. Instead of typing specific (and often cryptic) commands in a terminal, GUIs let users interact with files and programs by clicking and dragging.

Conversational user interfaces (CUIs) are a spoken or written way of interacting with a device. CUIs aren’t…


We’re big fans of Sketch. We use it for everything from low-fidelity wireframes to pixel-perfect mockups.

However, many of us who cut our teeth in Illustrator find that while Sketch rocks 99% of the time, there are still a few workflows that, well, need work.

Specifically: it’s a pain to unlock layers. Illustrator has a handy keyboard shortcut but Sketch doesn’t. And it seems to be a common ask amongst the community.

So we made a plugin to do just that. To install it, simply download the zip and double-click the “.sketchplugin” files. Keep reading to learn more.


Why use Google Fonts anyway?

  • They’re free for commercial use
  • They’re super simple to set up
  • They can be quite fast (common fonts are likely cached)

Love ‘em or hate ‘em, Google Fonts are everywhere. Here are my favorites…

Lato

Looking for a sans-serif? Lato is a great place to start. It’s a versatile font available in 5 weights. One of my favorite uses for Lato is in all-caps with loose tracking, as on my personal site.

Source Sans Pro

How about another versatile sans-serif? Source Sans Pro is available in a whopping 6 weights and even comes in a serif version. It shines in headings or body copy.


Wizard of Oz prototyping is the process of making something manual appear automatic. The term comes from the novel and film, where the wizard turns out to be a man behind a curtain.

So what does this have to do with software? A big component to Agile and lean development is to minimize your build to learn ratio. That is, to build as little as possible to learn as much as you can.

This can be easier said than done, so let’s look at some real-world examples.

If I build it, will they come?

I attended a great talk by Angelique Rickhoff the other day where she…

Stelios Constantinides

Product Designer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store