Fork me on GitHub

Build - Visual Design

Objective

We produce appealing visual designs that engage users and build trust.

Principles

Visual design relies heavily on traditional concepts such as color, typography, hierarchy, space and balance.

All of these concepts are taken into consideration as we build out a product. We respect that these concepts are complex in nature which means we can never stop learning.

Our Process

The visual design process builds upon previously defined requirements such as user profiles, goals and prototypes.

Throughout the process we remind continually remind ourselves to simplify. Refining and simplifying a design keeps us focused on solving the problem at hand both through interaction and visual design.

The final designs are built using a variety of design concepts and tools.

Concepts & Tools

Elemental design concepts apply to all the visual design work we produce while tools are employed in varying degrees based upon project type and size.

Basic Design Elements

We practice a variety of fundamental design concepts in all of our visual work. Concepts include: Color, Typography, Shapes, Space, Contrast and Balance.

This post on usability.gov provides a succinct definition for these and many other related terms: Visual Design Basics

Style Tiles / Moodboards

With the variety of devices and screens supported by today's solutions, we favor using design samples such as Style Tiles that provide a flavor of how the screens will look and feel.

This allows us to communicate the visual language without having to design complete comps in a variety of devices sizes - saving us time and money. Once this language is agreed upon it will then be implemented in the subsequent mockups.

Comps / Mockups

But what will it look like? Comps and Mockups provide a first glance at the complete picture.

In our experience, rushing to this point and skipping the previous steps often leads to misinterpretation and a narrow focus on that specific context. We love a good comp toto, but now we are properly prepared to produce some high quality samples of the most valuable parts of your app in a handful of critical screens (and device sizes!).

We typically create these comps using Photoshop, Illustrator or Sketch; however, the tool is less important than the images themselves. We will walk you through each comp, our decision making process and then incorporate your feedback.

Design Assets (graphics, photography)

At this point we have settled on the designs and we begin executing them.

For native mobile apps such as iOS and Android this means we start generating asset files that the developers will implement.

For web apps and web sites we typically diving into HTML, CSS and Javascript and start churning out responsive views that assemble into the final product.

HTML, CSS, Javascript

The design of your web app or web site begins taking shape as we develop all the front-end code.

We utilize the latest and greatest HTML5, CSS3 (LESS, SASS, Compass, Bourbon, etc.) and javascript (AngularJS, jQuery, etc.) when building products.

Our experience in this area is deep and we know what it takes to produce a snappy visual design that is well structured for future growth.

Branding Packages

Starting from scratch? Looking to re-brand yourself or simply replace your crummy logo? We can help there as well.

Whether its a new company branding package, logo design, or native iOS/Android app icon we've got you covered. We certainly don't want to turn you loose with a new web design that's crippled by a less than stellar logo.

We pride ourselves on our design work and know what it takes to build a complete package - branding included.

  • © 2013. Made by the fine folks at CramerDev.