Ella Chiang 4/15/21 Ella Chiang 4/15/21

Color Explorations

Over the next several posts, I’ll be sharing some color explorations playing around with color scales. This series was created on my desktop computer with Figma, a tool traditionally used in digital product design. Part 1 of Color Explorations features an abundance of rectangles and squares. In software development, the rectangle is the easiest shape to build. Look closely at an app or website and the rectangles are everywhere from buttons to text fields to containers for text and photos.

Part 1 uses the simplest vessels to bring the focus to the colors - the contrast between different shades and tints, the vibrancy of a particular hue.

Part 2 starts to break from this rectangle motif by slowly introducing other shapes: triangles, circles in both wholes and halves. And applies other aspects of things I’ve learned in my product design work such as application of opacities and gradients. Objects begin to overlap and break from the geometric mold of Part 1 - organic shapes are introduced bringing in a little bit of liveliness and playfulness.

Ella Chiang 4/1/21 Ella Chiang 4/1/21

Spring Color Palette

Inspiration image from Yoksel 🌿 Zok on Unsplash

Something fun for the new season. Can’t believe it’s basically been more than a full year now of the pandemic.

Ella Chiang 3/15/21 Ella Chiang 3/15/21

Daily UI: 009 Music Player

More playing around with dark mode. Also tried a new technique for adding gradients to a stroke and getting a glassy effect by following this tutorial by @baulemdesign, which is what I applied to the buttons and the border around the album art. Reused some of my background shapes from a previous post.

Ella Chiang 3/1/21 Ella Chiang 3/1/21

Daily UI: 010 Social Share

The prompt for this one seemed really simple to me, just social media buttons? So I took the opportunity to try out other types of backgrounds for the mockup. Practicing my use of the pen tool to draw curves, gradients and opacity, as well as working with colors.

Overall, I’m pretty satisfied with how the shapes turned out. I added the layer blurs to add more depth and blend the lines to reduce sharp edges that come from just straight drawing vector lines. Played around with combining shapes to cut out that X close button. The X is a cutout as well as a divot in the corner of the card so the background color would show through the button.

Exploring others’ posts for #dailyui010 on dribbble, I saw a lot of people did animations for this challenge. So I’m wondering, what are some good resources for learning animation? Let’s say if you’re a complete beginner? I’ve seen some YouTube videos on Figma’s SmartAnimate, but I’m looking for more of a full-bodied course that teaches a strong foundation in order to build on that to create my own stuff. Any recommendations are much appreciated!

Ella Chiang 2/15/21 Ella Chiang 2/15/21

Sunsetting

I made a little sunset illustration. More practicing. This style of illustration suits me - all shapes and colors. I also found it interesting to play with the white card on white background and just using the shadow and a slight border to define the card - subtle.