Dictionary for non designers

made by unknw.com

Hi, what’s up with the project? The client is already asking if we have anything to show yet.

Hi, I was working on wireframes. I slowed down a little figuring out possible composition options, because we were given a hint that there’s gonna be a lot of text! I want there to be more white space in final design that’s why I’m struggling a bit.

OK... Have you find a solution to the problem yet? Maybe it’s worth clarifying something with the client at this stage?

Not really! I’ve actually already moved on from low-fidelity prototypes and I’m already doing the concept, don’t worry! I’m thinking of testing a couple on mockups. I’m not quite sure how raster images will look in real life plus there is no normal text yet, everything is in lorem ipsum.

What? What is low-fidelity prototype? Do we usually show our clients concepts or it’s something not very presentable? What are the mockups? Do you think something needs to be tested? What’s up with this lorem ipsum thing?

Oh. Emmm. Low-fidelity prototype is basically the same as wireframes. And the mockups equal digital model that we open in Photoshop. Lorem ipsum is a dummy text...

You’ve lost me! What should I tell the client?

What do you mean? I told you everything!

Composition

Gradient

Grid

CMYK & RGB

Lorem Ipsum

White space

Wireframe

Leading

Mock-up

Vector & Raster

Tracking

Prototype

Accent

Kerning

UI

Concept

Component

Wacom

Serif & sans serif

UX

Auto layout

Alignment

Vertical rhythm

Check yourself by playing a quick card game!

MADE BY UNKNW.COM

Composition

Composition or layout, is the arrangement of visual design elements that create a complete image that attracts and holds viewer’s attention.

Gradient

Gradient is a gradual change from one color to another (e. g. blue transitioning gradually to green).

Grid

Grid is a group of intersecting vertical and horizontal line that can help you structure content on a page. They also help keep the content organized and clean.

CMYK & RGB

CMYK is a color model which is used for printing purposes. CMYK stands for Cyan, Magenta, Yellow and Key (black). The main difference between CMYK and RGB is that RGB is much more vibrant. Every color that you see on your screen is RGB and it stands for Red, Green and Blue.

Lorem Ipsum

Lorem ipsum (also known as dummy text). Designers use it when there is no time to write some meaningful text and use these weird number of symbols to imitate it. Later is swapped out with actual copy.

White space

White space also known as negative space. It’s a blanc space around a design element. It’s used to emphasize a certain parts of a layout. Even though it’s known as white space, it can be any color.

Wireframe

Wireframe is commonly used to layout content on a page with user needs in mind. Wireframes are used early in the development process to establish the basic structure of a page before visual design and content is added.

Leading

Leading (also known as line-height) is the space between two lines of text. there’s must be enough space between the lines so they’re not touching each other and the viewer can read text comfortably.

Mock-up

Mock-up is a real or digital model used to test early design ideas and see how they could look in the real world. For example some coffee cups can be used to demonstrate a client how their logo will be placed and look in reality.

Vector & Raster

Vector images can be scaled without losing any quality. We can create vector images in Adobe Illustrator or Figma. Rasters will get blurry and lose some quality when scaled. They are made up of a set grid of pixels. Designers work with raster images in Adobe Photoshop.

Tracking

The main difference between kerning and tracking is that in tracking we adjust a space for groups of letters or entire blocks of text. Tracking affects every character in the selected text and also used to improve the readability.

Prototype

Prototype is the early design model of the final interface of your website or app with some interactions and animations. Early in the design process, clients need to understand how everything is organized and just looking at the blueprint-like wireframes is not enough.

Accent

When a designer uses word «accent», he/she is talking about emphases that are placed on a page via using certain colors, typography, alignment, composition etc.

Kerning

Kerning is the space between two specific characters. designers use this term when they’re talking about adjustment of space between pairs of letters in the same word. Mostly used in logo design.

UI

UI is the visual or graphic elements a user interacts with on a platform to achieve their goal. User Interface goes beyond just web. Your day to day electronics like toaster, phone, remote control etc. — all of them have interface you have to interact with therefore they also have UI.

Concept

Design concept is the way you see and understand visual idea of the project.

Component

Components are usually used in Figma for more convenient process of building a digital product or website. You can think of it in terms of Legos, where you’re able to construct things with a box of common and consistent pieces.

Wacom

Wacom is a company that makes types of tablets for the computer that is extremely useful for all photographers and graphic designers. With the interactive pen that comes with it you can draw illustrations or add some interesting bits and pieces to your design.

Serif & Sans serif

Serifs are the small lines and hooks at the end of the strokes in some letters. Sans means «without.» A sans serif font has no serifs, therefore serif has.

UX

Refers to the overall experience of a person using a product, platform or service, especially in term of how pleasing it is to see or use. It’s important for a designer who works on a user experience to think and analyze what emotions a user goes through while trying to use a certain platform.

Auto layout

Auto layout is a very useful feature that allows designers create designs that grow to fill or shrink to fit, and reflow as their contents change.

Alignment

Alignment is a design principle that refers to lining up text or graphics on a page. Content can be aligned to the left, right, center side of the page or can be justified, anchored evenly between the left and right sides.

Vertical rhythm

Vertical Rhythm is when a body of text and all other content of a page is aligned to evenly spaced horizontal lines.

Now we’re going to test your memory by playing a card game where you need to match up a TERM with its DEFINITION