At the end of December 2019, I put a few notes together for my colleagues after having a week or two to really play around with Framer X

Best Use: Interaction Design (IxD)

Transitions, micro-interactions, etc. all can be tweaked with real react code, plus react props can be added as custom properties to the FramerUI based on the component you’re working in.

So if you’re not comfortable with code you can still tweak interactions.

Second-Best Use: Advanced Prototyping

For example, I created a prototype with a live, can-be-interacted-with map using a Mapbox API component. …

I previously wrote about building a Design System in Sketch for my own BloomBox project.

As a member of a four person product team, on my own I built out a design system in Adobe XD for use across the team.

Although I can’t take credit for the overall visual design (a UI designer was on the team), I personally rebuilt every component within XD and created nested symbols that could accept design changes across multiple components, screens and files.

Here’s an example of one of the symbols:

A Zillow Mortgage Data Mini Project

Data Visualization can be an incredibly useful tool to discover insights in user testing data and in business analysis in general. When done right, the data is plain for all to see and can help avoid lengthy, subjective arguments.

To exemplify this, in December 2018 I took mortgage data made publicly available by Zillow (thanks!) and with the help of Tableau, turned this:

Data as of 11/30/2018 via (See ZHVI Summary. Manually adjusted color based on calculated median.)

Into this:

We’re often bombarded with exceptions: the kid who graduates from Harvard at 16, the college dropout who is innovating innovation — heck, even at church there’s usually the one guy whose story is about turning his life around after starting hard drugs at the age of 12.

Humans are attracted to contrast and stories inspire. We should absolutely celebrate others, especially those who overcome hardship. Their success is our success.

But it’s also okay if you’re not the next Steve Jobs.

Stay curious. Stay consistent.

Stay hungry.

(In Sketch)

This is part two of the Bloombox Redesign Project case study:

This post (like all good design systems) is a work in progress. Check back later for more detail on how some of the components were put together.


Welcome to part two! If you want to dig in while following along, you can view and download the design system from sketch cloud.

The purpose of this section of the case study — and also this portion of the project…

(With Sketch and Flinto)

This is part three of the Bloombox Redesign Project case study:

Building the Concept

While I was still designing the interface, I tested some of my interaction ideas. If an interaction was too difficult or time-consuming to prototype (and eventually code), I could make adjustments to the interface (how it looks) before I was committed.

This is typical in my work alongside developers. If a product improvement might better the user experience — say 10% — but doubles the design…

My friend Paul Chen posed some questions to me at the beginning of 2018 and I’d like to do the same next year.

Throughout November and December I’m going to post some rough (As in ‘not well-shaped’, not as in ‘tough’) questions for 2019 here in Medium. I won’t be looking for feedback yet, it’ll just be a place to start collecting my thoughts.

These questions may not seem connected and they may end up being disparate, but we’ll see..

On January 1st I’ll post two pieces: what I learned in 2018 and my questions for 2019.

#1: What’s the connection between ‘fi’ and ‘finna’?

I’m a Black…


(The first event is tomorrow, Thursday, July 5, 2018)

Slack Channels

If you don’t already know, Slack is messaging software. You can create a free account: A workspace is like an organization or group and within that group are different channels. A channel is like a chat room, usually organized around a topic, or sub-group.) There are several South Florida related and UX related Slack workspaces that are open to the public and have members from across different companies and industries. Sometimes they have “jobs” channels where people post job opportunities. …

A few weeks ago I solved a workflow problem I’d been having and wanted to share the quick solution with you:

Two open two instances of an application in MacOS:

Open Terminal

Input this command line: [open -n -a “APPLICATION NAME”]

That’s it.

I’m a UX Designer and the product team I currently work with designs prototypes with Justinmind. You heard that right; “just-in-mind”. Unlike Sketch, Figma, Framer, Invision, AdobeXD or even Axure, you might not’ve heard of Justinmind, but it has its merits and deserves a full pro/con discussion in a separate post.

One of the cons of Justinmind is that you can’t open two different prototypes at the same time, mainly because unlike in Windows, you can’t open two different…

In MacOS:

⌥ (alt / option) + ⌘ + H will hide all other applications except for the current one.


Jason James

Design, systems thinking and business for the common good. Twitter: @jas0nmjames

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