30 Days of Design Experiments

Background

I've been meaning to explore various design-related ideas and tools for a while now. I'm also inspired by @beeple and specifically his Everydays. As a result, I've set up this page to loosely follow in his footsteps. The below collection is simply a daily-ish public log in the vein of Beeple's Everydays. I don't plan to post everyday, but I hope to have a healthy collection of work over the span of a month. Let's see what happens. April 4th is day one.

April 4th, 2016 - Nectar Music

This set of design experiments births from an app idea currently called Nectar Music. I have yet to decide if I'm actually going to take the project on. The images below are just an exploration of app icons for it. I spent roughly two hours experimenting in Illustrator.

April 5th, 2016 - Buffer UI Concept

When first using Buffer I had the desire for additional functionality within the interface. One such example is demonstrated in the After mock-up below. In this specific example, I wanted to have scheduled posts be not-so-scheduled. Specifically, I wanted to have a ± X min option to add time variation to scheduled posts. I have two questions regarding this concept:

1. Would this be a valuable addition for others?
2. Would this conflict with Buffer's Optimal Timing Tool algorithm?

Before

After

April 6th, 2016 - Elements of Design Animation

I wrote the article The Anatomy of Visual Design - Elements, Principles, and Constructs a while back and I always wanted to spend some time working through an animation for the Elements of Design section. The goal of this little animation was to work through each of the eight elements linearly as they each build upon each other. The GIF below is the result.

April 7th, 2016 - Experimental 3D Overscroll Animation

I have a lot of ideas regarding UIs in 3D space. I think there is great power in the spatial understanding that 3D UIs can inherently provide. As a result, I plan to explore 3D UIs a lot more. Below is a small example that is a take on the you've-reached-the-content-boundary also known in Interaction Design as overscroll. I ran the Unity3D experiment on my phone where I enabled the touch location to show (white dot).

April 8th, 2016 - Vocabulist Icon Sketches

I'm finishing up a simple mobile app for iOS + Android called Vocabulist - Vocabulary Companion. It is a simple and focused app that simply lets you look up word definitions and save them for later reference. Vocabulist is a small tool that I've wanted to make for myself while simultaneously providing a small scope for testing some 3D UI ideas. Below are a few of the icon sketches for the app.

April 11th, 2016 - 3D Experiments

3D UI exploration.

April 12th, 2016 - 3D Experiments

3D Flower Experiment WIP.

April 13th, 2016 - slurve.js Website Sketches

I did not get to any digital experimentation today as planned, but I wanted to post my progress regardless. Below are two photos from my sketchbook that represent a portion of my process. These sketches help solidify what I'm going to build for my slurve.js website.

April 14th, 2016 - slurvejs.com Website Examples Section

I'm just putting the final touches on my new website slurvejs.com. Below is a screenshot of the current build of the Examples section.

April 15th, 2016 - slurve.js Card UI Experiment

I didn't have as much time as I would have liked for my experimentation today. As a result I just spent a little time getting creative with my recently launched slurve.js library. Below is a stylized card UI element.

April 18th, 2016 - Crossy Word Flyer

In preparation for launching Crossy Word on iOS and Android, I wanted to make a flyer/ad to post locally. Below are my sketches for the flyer in addition to the executed result.

April 19th, 2016 - Unity Editor - Player Settings App Icon UI

There are a few things that the Unity Editor can improve upon and the Player Settings App Icon UI is one of them. There are a few core issues I have with the UI:

• Inefficient - more UI controls than necessary
• Confusing - icons aren't represented at their actual size
• Inconsistent - editor panels have inconsistent use of control placement and spacing

Though I only mocked up two sketches, Sketch 2 is a great improvement to the original as it improves on the first two bullets above. The last bullet is an editor-wide issue. I simply wanted to showcase some improvement ideas, but a true design solution would need to account for more aspects (localization, states (idle, active, etc.), panel resizing, Unity internal editor UI guidelines, etc.).

Before

After - Sketch 1

Before

After - Sketch 2

April 20th, 2016 - 3D ListView Drag UI Concept

I've been experimenting with a 3D ListView scroll concept recently and I wanted to see what it looked like when the list wasn't full of items. This is the result (captured on my phone not a video mockup).

April 21th, 2016 - 3D Helix Scroll UI Concept

I've been wanting to experiment with this idea for some time and I finally sat down to do it. The idea stems from wanting to see what it would look like to have a truly 3D ListView where 3D manipulation could lend itself to the theme of the application. In this particular case I have the idea to create a hybrid list and calendar app, something using "Helix" as part of the name. Here is a sample experiment regarding this idea. This isn't Adobe After Effects, it is programmed (aliasing is poor due to the GIF capture).

April 25th, 2016 - Vocabulist Icon

On April 8th I posted some icon sketches for Vocabulist. I've since finalized the icon. The icon uses an abstract "V" in addition to an overlaid "list" icon using the color palette of the app itself.

May 2nd, 2016 - Emissive Materials Experiment

Simple experimentation with emissive materials in Unity.

May 3rd, 2016 - Game Dev Experimental Mushroom

Below is an extension of what I learned yesterday working with emissive materials. It is an animated game scene prop for a game called "Wizard Golf".