Feature Requests

Collapse Artifacts in Figma

Figma, Sketch, and other UI Design tools have what I like to call an “anarchy canvas”, a functionally infinite canvas, with no built-in mechanisms for organizing, which forces designers to use spacing and positioning to communicate relationships between objects.

One of the many problems that arises with this anarchy canvas is that designers leave artifacts surrounding the final screens.

A screenshot of a few screens for ParkHub with their associated artifacts floating around them.

Typically, these artifacts are either removed once they’re no longer needed, or are moved to a “playground” page, to separate them from production-ready screens.

Both of these solutions have significant drawbacks.

With the first solution, the inspiration screenshots are lost to history. What was the designer thinking? What were they trying to emulate? When we remove inspiration we remove the context surrounding the decisions that were made.

With the second solution, we disconnect the artifacts from their relevant elements, again, destroying useful context. The artifacts can be copied by themselves, creating orphans of inspiration, or the artifacts can be copied along with their relevant elements, but this runs the risk of the relevant elements becoming out-of date as the production screens continue to be developed. To prevent this, the designer will have to update both places.

* Typically in Figma, master components exist on the final page, which is convenient in tying them to the relevant screen, but it makes it hard to find the master components without right clicking an iteration and clicking “go to master component. Sketch handles this differently, when you create a component (called a “symbol” in sketch) it sends it to a different page. Annoyingly, that different page also adheres to the “anarchy canvas” principle, where each new element is arbitrarily appended to the right of the most recent symbol.

Figma User Interface

Here are two (2) suggestions for Figma Designer to help make it a bit more user-friendly and magical to use.

Panel Expand / Collapse Animations

When toggling "Hide UI", the interface abruptly disappears and reappears (on the right side of Fig. 1a. ) 

It'd be delightful if the UI elements were swept away (dark green position graph) from the center of the screen and subtly faded out of sight. (light green opacity graph) as indicated below in Fig. 1b.

Fig. 1a.

Fig. 1a.

Fig. 1b.

Responsive Panel Colors

Figma thankfully allows users to set a background color for the whole project, which is a welcomed feature coming from Sketch, which locks you into using a white background. 

Unfortunately when using a dark background, the layers panel (left sidebar) and the inspector panel (right sidebar) are blindingly bright. Not only are they pure white, their typefaces and elements are thin and light.

To make the layer and inspector panels more readable, I propose that the UI of both change in accordance to the set background color of the project. I prototyped what this could look like in the column on the right. 

Screen Shot 2017-08-11 at 11.41.09 AM.png

Collapsible Activity Feed

To make the Google Drive Activity Feed a bit easier to browse, it'd be nice if we could click to collapse events into smaller rows. If you're auditing your company's recent Drive activity, it'd make it much easier to navigate. 

(Fig. 1) Position of the Activity Feed in Google Drive

By splitting each action into a "header" and a "body" section, it's easy to conceptualize a "collapsed" view for the Activity Feed.

(Fig. 2) 

Working prototype:

I'd like to try to build a working prototype of this idea. First I'll need to research whether or not there's a Google Drive API that allows users to pull data from their own Drive's, then I'll need to try to rebuild the existing user interface with the collapsibility functionality as described above. 

Facebook Gallery Expand

When somebody adds multiple photos in a Facebook post, the gallery is shown in a nice pretty mosaic view on your timeline. If there are more photos in the album than are shown, theres a small "+number" on the bottom right image.

Current Behavior

One might think clicking the "+n" would expand to show more photos in the mosaic. Instead, clicking the "+n" only opens the last photo (red) in the pop up window.

Here's a mockup of what I wish clicking the "+n" button would do: expand the album mosaic to show the additional photos.

Ideal Behavior

Somewhat related to this: I'd love to see Facebook add a filmstrip to the bottom of the photo viewer pop-up window. It makes it easier to navigate through albums by giving you a bird's eye view of the context of the album.

Thanks for checking out this article, I welcome feedback and suggestions in the comments, and feel free to connect with me on Twitter, etc.

Google Drive Finder Plugin

The finder window should show unsynced folders, without having to go into preferences. 

I use the Google Drive macOS Finder Plugin. In order to save local storage space, I don't sync all of my Drive folders to my computer. Unfortunately this means if I'm looking for something I can't find, I have to look inside my preferences pane to see if the file might be in an unsynced the folder.

A better system would be to show the unsynced items within finder, so I could explore the directories, and only download what I need. The unsynced folders and files could be shown in grey, and a right-click could give me an option to sync it to my local device. 

Preferences Pane

Unsynced folders are shown in the preferences pane. This is great functionality, but it's not easily accessible. (read: user-hostile) 

In addition to being hidden away, the preferences pane lacks the ability to show files inside folder -- again going back to my use case where I'm looking for a file I haven't synced.

Finder Window

Unsynced files / folders should appear in the finder window.

Screen Shot 2017-07-11 at 11.59.00 AM.png

Sync (download) remote files / folders

Here's a masterfully crafted doodle of a right-click menu interface that allows for the download of offline (greyed out) items. 

Meetup Week Calendar

When looking for local meetups and events, you have to consider your own schedule. Work, school, business meetings -- life often gets in the way of your networking efforts.

To help users see which events fit their schedule, Meetup.com could deploy an improved calendar view. Week view calendars visualize time of day vertically, and day of the week horizontally. This is perfect for seeing which events fit within your available blocks of time.

Concept sketch

[Fig. 1] Sketch made with the Google Keep mobile app

From screenshots I built a block-frame design (Fig. 2.3), as well as a blank slate (Fig. 2.4) to use as the canvas for the calendar interface.

[Fig. 2]

I adopted patterns from Google Calendar's week view, where the seven columns for each day are the same width, and the far left column for time [hh:mm] is just a bit smaller.

[Fig. 3]

The initial mockup contained a light color pallet that was difficult to see, so I darkened the colors to add visual contrast. [fig. 4.1] 

I also removed the deselected groups [fig. 4.2], since it's more useful to only show groups the user has selected for viewing.

[Fig. 4]

[Fig. 5]

Genius Chords Viewer

You're having a jam session with your friends. When you look up song chords, every search result comes up with ugly, non-mobile-friendly sites.

This is a plea for Genius.com to help bring song chords into the 21st century. 

Given their strong community of contributors, it'd be reasonable to imagine that some users would be willing to contribute chords, so others can learn how to play the songs.

Here's a prototype of this idea, along with some related diagrams.

I tried to find a toggle on their website, to conform to their current design, but I came up empty handed. I decided to pick Google's Material Design toggle slider, as the Genius design somewhat resembles Material Design with its flat, block-oriented UI elements, as well as its bright colors. (The purple used in this post is similar to the pastel purple used on Genius.com) 

Rebuilding the Google Material Design toggle switch.

I would've liked to have built an animated .gif of this animation, but this diagram will do for now. Basically the chords (purple) ought to slide out from underneath the lyrics (grey), with an "ease in" behavior for both opacity and position.

Animation overview.

In addition to the animation helping the users to make sense of the relationships between the chords and lyrics, whitespace helps to separate chord/lyric pairs from one another, to reduce confusion.

Block spacing.

Better Sharing in Spotify

To make it easier to share music with friends, I recommend Spotify take some hints from Snapchat's checklist interface, which - in my opinion - is part of the reason snapchat is so engaging; because the sending mechanism is so simple and powerful. 

I'll walk through my UX design process workflow in this post, but if you'd like to skip to the completed designs, click here.

Overview of prototype workflow, combining and synthesizing existing elements to make new elements.

Overview of prototype workflow, combining and synthesizing existing elements to make new elements.

First I outlined screenshots of Snapchat. The checklist interface is incredibly simple, but I thought I'd build an outline of it just for fun. 

Formal Analysis of Snapchat checklist.

After analyzing the visual architecture of the Snapchat interface, I outlined Spotify's "send" window. This helps me preserve the padding  width between the edge of the screen and the window.

Spotify Mobile Share Window

To make these outlines, I use the rectangle tool, bright colors, and low transparency so I can see the background and the overlay shape. Once I get the shapes pixel-perfect, I add a high-contrast stroke to better visualize the shapes.

Page navigation showing the user path to the share menu.

After revisiting the design, I made some minor changes to improve the visual continuity and overall prettiness of the checklist. I also added an extra "share to my feed" checkbox, to merge the functionality of the above "post to..." & "share to..." options all into one single interface, which requires fewer taps by the user. 

A few iterations of the checklist design. #2 is simplified and cleaner, #3 adds a scrollbar on the right edge.

Please let me know what you think of this design in the comment section below, I'd love to hear your feedback and I'd be willing to make changes and credit the changes to you on the blog. Iterative design is about constantly improvements, and I'd like to incorporate that into this blog as well. 

Spotify Notification Drawer Player

In an attempt to reclaim some wasted space, I redesigned some of the UI elements in the Spotify Player in the Android Notification Drawer. The album art is larger, unnecessary text has been removed, and playback buttons are closer together to make them easier to reach with one-handed operation (sorry lefties -- maybe there can be a left-hand mode with the buttons on the left)

Hopefully this design looks a bit more balanced, let me know what you think in the comment box below!


  • Quickly sketch idea in my journal while sitting at a stop light on my morning commute.
  • Take screenshot of the Spotify player. (again, while on my commute)
  • After work, take another screenshot so I don't have Google Maps navigating in the background.
  • Take photo of journal page.
  • Import photo into Affinity project.
  • Make crude sketch in Affinity. (Fig. 1.)
  • Build blockframe by placing transparent rectangles on the screenshot, then colorizing them. (Fig. 2.)
  • Copy the original blockframe & start prototyping the new design. (Above)
Fig. 1. Digital wireframe sketch with markups in red.

Fig. 1. Digital wireframe sketch with markups in red.

Fig. 2. Iterative blockframe design using transparent objects for placement.

Google Project Sunroof

Google's Project Sunroof is a tool that estimates solar potential of buildings by analyzing 3D models of buildings from Google Maps, as well as other factors. I've compiled some feature requests that could improve the service.

On this page:
- Dark Mode

Dark Background

With the current color scheme, the highest value data point is also the least visible. Yellow intuitively signifies solar potential, but the light grey background makes yellow very difficult to see.

Here's a mockup of the data with a dark blue background, which makes the data much easier to see. Built with Google's own map style maker, I used the following parameters: roads = 100%, landmarks = 0%, labels = 0%, color = "Aubergine"

If you're aware of any similar tools designed to estimate solar energy potential, please link to them in the comments below. I'll try to add them to AlternativeTo.com, my favorite site for finding alternatives to specific apps and services.  


Here are some feature requests and interface mockups for glassdoor.com, a site designed to assist job-seekers by making companies and salaries more transparent.

On this page:
- Search Histogram
- Wage Gap Analysis

Salaries > Search Results > Show Histogram

Replacing the horizontal bar with a histogram serves both an aesthetic and pragmatic purpose. Histograms are prettier, universally understood, and allow the user to recognize patterns. (i.e. entry level positions in your city are significantly lower than the national average entry level position, but the mean salary is comparable to the national average)

User interface mockup: 1) show distribution histogram of submitted salaries, 2) reveal salary with cursor hover.

Companies & Reviews > Company Info > Wage Gap

Transparency is good. Sometimes transparency seems bad, but that's only when it reveals the bad stuff hiding beneath the surface. To read about the benefits and dangers of increased wage transparency, check out this article about Buffer's transparency initiative.

This feature, if it could be properly executed, would illustrate the wage gap between the lowest paid worker and the highest paid executives. Submitted salaries (green)  would be compared to the estimated pay of the highest paid executives based on variables including (1) yearly earnings of the company (this field could be crowdsourced, for users who want to do some digging online) and (2) CEO-worker pay gap in respective country, state, or other district where this data is readily available.


Show Album Artwork

Feature request for Spotify to show Album Artwork in the list view, to improve usability. This would allow users to quickly scroll through a list to find specific songs based on the color of the album, instead of trying to speed-read song titles. 

Related links: Twitter thread with links to the Spotify Community request, where pretty much all of the comments are bashing Spotify for not having this feature.

Some Changes for Squarespace

Feature requests for Squarespace, my current website builder.

On this page:
- Suggest Blog Thumbnails
- Number of  Available Pages
- Scrolling: Summary Carousel Block
- Lightbox Filmstrip

Blog Editor

Populate optional thumbnails from image blocks in the "Content" pane.

Show Available Pages

To help users see how close they are to running into their subscription's page number limits, there should be a small quota tally at the bottom of the page structure editor. 

Two Finger Scroll

In the carousel view of the summary block, there are two left/right arrows on the top right corner (1) used to navigate to the next/previous pages. To improve usability, the carousel block should respond to intuitive horizontal scrollwheel events such as 1) trackpad two-finger scrolls and 2) touch screen single finger scroll events. 

Basically, make the carousel block actually behave like a carousel. 

Lightbox Filmstrip

Anchor Links

On the subject of anchor links (the links that scroll to different positions on the page) I have two (2) suggestions.

1) I'd like to see Squarespace adopt an automatic anchor link system for all header text similar to what's used on Github. When the user hovers their cursor over the header, a "link" icon could appear.

2) my second suggestion 

Affinity Designer

Feature requests for Affinity Designer, my vector illustrator of choice at the time of this writing. On this page:
Open Recent
Quick Preview

Also, here's a twitter search of tweet from @jamiefeedback to @MacAffinity 

Menu > File > Open Recent > [ ... ]

The following are requests for the "Open Recent" section under the "File" menu, to help improve the user's ability to find recent projects. 

File > Open Recent > Show Image Preview

File > Open Recent > Show Image Preview

File > Open Recent > Search & Scroll

File > Open Recent > Search & Scroll

Quick Preview

In macOS you can preview a file by selecting it and hitting the spacebar. Unfortunately, Affinity files are not optimized to utilize the typical screenspace used by other image filetypes such as .jpg, .png, .psd, etc. Here is a comparison of the preview screen area. 

.affinity file Preview

.jpg, .png, .psd file preview

Google Maps

Feature requests for Google Maps, to help us improve our understanding of our planet.

On this page:
Typical Traffic Graphs
- 3D on Mobile
- Snapshot of ideas

Increased Resolution of Typical Traffic Graphs

For those of us trying to avoid traffic, a "congestion timeline" would be very valuable. Google already has a "Typical traffic" slider to illustrate which roads are usually the worst, but it doesn't show a timeline. Here's a user interface prototype I've made to illustrate this idea.

Diagram 1: Bar graphs illustrate traffic data per weekday, and per hour given the selected day.

Diagram 1: Bar graphs illustrate traffic data per weekday, and per hour given the selected day.

As the user scrolls and zooms to view different areas, the graphs should automatically update, with smooth "ease in" bezier animations.

EDIT: as of June 2017, Google now provides graphs to indicate how long a specific trip might take depending on the time of driving (i.e. longer during rush hour, etc)

I've annotated a screenshot of this new feature below, where I indicate the need for more granularity, as well as the ability to more fully explore the dataset. (all 24 hours of the day, instead of the nearest 3 hours) 

Support for 3D imagery on Mobile

Snapshot of ideas

I look forward to publishing more feature requests for Google Maps and mapping technologies in general. Here's a collapsed screenshot of my feature requests ( [fr] ) for Google Maps. 


Some feature requests I've come up with for Twitter over the years.

Pinch to zoom out

A feature request for all platforms, both mobile and desktop to improve the user experience of looking through tweeted photos.

Screen Shot 2016-12-25 at 10.13.14 PM.jpg

I will continue to populate this page with diagrams of my feature requests for Twitter, but until I do so, here's a collapsed list of the various ideas I have for them. (some of these might not make sense on their own, but they'll make sense when I publish them)

Screenshot of my Workflowy note of my Twitter feature requests (that's what [fr] stands for, this tag helps me quickly search for feature requests in my notes)