Sign in

Hello. I write about design, UX, UI, animation, entrepreneurship, art and life in NYC. UX lead Lelantos Press, Artist, UX GA grad, top medium design writer.

How innovative thinking can define the visual future

Icon representing community and interconnectedness.
Icon representing community and interconnectedness.

To create in gender-neutral terms, designers need to look beyond the traditional ways of defining personas. Gender neutrality embodies the idea that society at large, in its policies, language, social structures, and behaviors needs to go beyond stereotyping according to types, identity, and gender roles.

Thus, a gender-neutral persona presents…


A neutral color scheme and screen layout.
A neutral color scheme and screen layout.

A contrast to screaming brand presences

Neutral design arises out of a need to declutter. It creates a sense of calm amidst chaos, an oasis of simplicity in the midst of overabundance. It gives consumers ease of use and perhaps an emphasis on product sophistication.

The definition of neutral is can be summarized as such:

Belonging…


Do you like counting pixels?

If yes, you can relax. If no, this is even more important.

A 1-pixel grid illustrating 16-pixel UI elements. Each element is set 16px x 16px, the square in the center with rounded corner radius, and the square on the right with fully rounded radius creating a circle. Designed with XD.
A 1-pixel grid illustrating 16-pixel UI elements. Each element is set 16px x 16px, the square in the center with rounded corner radius, and the square on the right with fully rounded radius creating a circle. Designed with XD.

Pixel-perfect design provides the most precise creative content design as every pixel is accounted for and utilized

For example, a static iPhone X screen viewport measures 375 x 812 pixels, (pixel ratio of about 3). This provides the designer with 304,500 pixels to design with. That is a lot of pixels to create with.

For…


This landing page is defined by white space. The brand logo is featured in the center of a full color gradient screen, and one actionable button sets the content hierarchy, to scroll down.
This landing page is defined by white space. The brand logo is featured in the center of a full color gradient screen, and one actionable button sets the content hierarchy, to scroll down.

White space is defined as the space on a page without information or data

Conceptually, it is also referred to as negative space. Contrary to its name, white space can be any color, any gradient, or even a full-screen picture, or movie.

How white space impacts information architecture

Making use of white space can be an…


Design Essentials: Bézier curves

An animation showing a straight line with two nodes transforming itself into a curved line with variations.

We’ve all heard of the Bézier curve. But do we really know how to draw one, how to apply it within applications, how to write it in code, or who discovered the concept? Let’s find out.

The genius of connecting two points by optimizing their control handles

A Bézier curve consists of two nodes with attached control handles. The values of…


They are en vogue and ubiquitous

Fixed, or static, icons and elements are now part of our screen experience, whether users are aware of it or not. For some actions, such as the scrolling-back-to-top, users expect a fixed icon to be integral to a content-heavy site by default. …


A 3-column/3-row grid with designated grid-areas per div, with a Firefox grid overlay. See Figure 1.
A 3-column/3-row grid with designated grid-areas per div, with a Firefox grid overlay. See Figure 1.

Discover the fun of creating multiple grid compositions with css grid-area

CSS grids provide powerful properties to style static and responsive grids. Some come with ease-of-use, others with distinct complexities. One of my favorite property for an immediate layout visual is the grid-template-areas/grid-area property.

In Figure 1, the <div class=”boxes”> is defined in css as a 3-column and 3-row-grid, with .boxes…


Random fluid blob shape.
Random fluid blob shape.

Amorphous, vague, and nebulous design icons

How to describe a blob? Just as the noun implies, a blob is a seemingly random, pseudo-organic, shapeless form that is rendered as an iconic vector shape, commonly referred to as svg. In its primary form, it suggests growth and flexibility, boundlessness and expansiveness.


Design your story in columns and rows

CSS grids are powerfully playful. With a few lines of style css and a number of html div tags, a CSS grid can easily implement an elegant responsive design to any screen layout, without it being difficult to grasp as a concept.

Grids have fascinated designers for centuries. And grids…


Divergent creative thinking and convergent audience feedback

Note: The spelling of Publissh is intentional.

A “Publish” button but spelled with two “s”, and in so doing, representing bliss in Publissh. This not only boosts the writer’s motivation, it also strengthens the bond with the audience.
Putting the bliss in Publissh not only boosts the writer’s motivation, and also strengthens the bond with the audience.

Publisshing is scary. Because as writers, we tend to think more in grand gestures, yet we share less of that thinking through practical application, which is, in essence, writing. Often, we hear that less is more and editing our stories and narratives to…

Eva Schicker

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