Outerform Logo
DemoPricingDocsBlogLog inCreate free account
← Back
Design

A good design is not just about looks

It feels like we’re all bombarded with countless forms, surveys, and sign-up requests. Competition for people's attention is higher than ever, and it’s not getting any easier. One of the best ways to stand out from the herd is having a great-looking form.

At Outerform, our goal is to help people leverage the benefits of out-of-the-box, beautiful forms—not just because good looking design is easy on the eyes—but because it can drasticaly increase user engagement. In this post I'll dive into why this matters so much, and offer some tips for improving your own form's design.

What is good form design?

"Good design" for forms is of course subjective, but when you break it down, it simply refers to the overall attractiveness based on a set of common elements: color, typography, layout, and use of images or iconograpy. When combined thoughtfully, these elements work together to create an inviting experience that delights the end user and encourages engagement.

Our psychology plays a big role in how we perceive and interact with these elements. These are a few of the main psychological principles worth paying attention to:

  • Cognitive Load: Know that feeling at a doctor visit when you need to fill out a complicated form with tons of questions? That's cognitive load. Simplifying a form's design reduces the cognitive load on users, making it easier for them to process information and complete the form.
  • First Impressions: A visually appealing form creates a positive first impression, which can increase user trust and willingness to engage. Basically, if it looks like you cared, your users will be more likely to fill it out.
  • Aesthetic-Usability: People tend to perceive aesthetically pleasing designs as more usable (even if that’s not always the case).

With all that in mind, let’s look more closely at the visual elements from above, and how to use them correctly so you can create beautiful forms that perform great:

Color

Color psychology is a crucial aspect of form design. In marketing and branding, colors can often shape consumers' impressions of a brand and whether they motivate a person to choose one brand over another.

Some studies have even shown that different colors can evoke specific emotions and behaviors. In one study titled “Impact of color on marketing,” researchers found that up to 90% of snap judgments made about products are based on color alone. For example:

  • Blue: Typically conveys trust and reliability, making it ideal for forms that require personal information.
  • Green: Associated with growth and positivity, often used for calls to action.
  • Red: Can indicate urgency or importance but should be used sparingly to avoid overwhelming users.

My personal take is that a color's impact on feelings is too closely tied to personal experiences to be universally interpreted. Research also indicates that personal preferences, experiences, upbringing, cultural differences, and context all complicate the effect individual colors have on us.

At the end of the day, when choosing color schemes, go with what feels right to you or what matches your company’s brand. Don’t overthink it.

Typography

Typography significantly affects readability and user perception. Just like color, Typefaces can express all sorts of emotions and moods. Here are some guidelines:

  • Font Choice: Use clean, readable fonts. Sans-serif fonts like Inter or Helvetica are often a popular choice for digital forms, however, a good Serif font can increase the appearance of legitimacy and seriousness.
  • Font Size: Ensure the text is large enough to read comfortably on all devices. We usually go with 24px or 32px for headlines.
  • Hierarchy: Use different font sizes and weights to create a clear hierarchy, guiding users through the form.

Sans Serif Typefaces

Some of my favorite free San Serif fonts (available on Google Fonts) are Inter, Bricolage Grotesque, Instrument Sans, Gabarito, or Onst.

Sans Serif Typefaces

If you're looking for a more serious or official tone, go with a Serif font. Lora, Newsreader, Merriweather, or Noto Serif are all great options.

Layout

Keep it simple. If you prioritize a clean and well-structured layout, you will make it much more likely that users will engage with and complete your form. Doing this will undoubtedly lead to better data collection and higher conversion rates. Here are some ideas to consider when crafting your form:

  • UX: Use clear labels and instructions to ensure each field is easily understood, logical grouping of related fields to create sections that are easier to navigate, and the progress indicators for longer forms to show users their progress. Using whitespace also helps avoid a cluttered look and makes the form feel less overwhelming. A logical and intuitive flow guides users through the form step-by-step, making the process feel seamless and straightforward.
  • Cognitive Load: Again, less is more with forms. A clear and concise layout that minimizes the effort required to complete the form will lead to faster completion times.
  • Reducing Drop-Offs: A simple, well-structured form minimizes the chances of users abandoning the process midway. Each step should feel manageable, encouraging users to continue to the end. Outerform offers a Question-Per-Page layout design option that can help with this. You might also incorporate an “estimated completion time” or “[n] other people have completed this form” element on the intro page.

Imagery & Icons

Custom visuals like images and icons can enhance the personality and bring life to an otherwise generic design. Think of this as your way to bring in your (or your brand’s) own personal touch, and differentiate from the crowd. Here are some considerations:

  • Visuals: Icons can replace or complement text, making forms more intuitive. For example, a calendar icon next to a date field clarifies its purpose. Images can bring warmth or set a specific mood.
  • Emotional Impact: Images can create an emotional connection. A smiley face, for example, can make a feedback form more welcoming. We employ this ourselves with our “Feedback” button on the top bar of our Dashboard.

There are a plethora of free resources you can utilize for both images and icons. Unsplash has 1000’s of royalty-free images to choose from. You could also generate your own with new AI tools like Midjourney, Visual Electric, Jumpstory, or OpenAI’s DALL·E.

AI generated imagery

For Icons, our go-to’s are Feather Icons, Hero Icons, and (shameless plug) the open source pack I personally designed, Ionicons.

More than looks

Good design is about more than creating something pretty—it’s about thoughtfully combining and leveraging the aforementioned psychological principles to enhance user experience and improve completion likelihood. By applying these principles, you can create forms that not only look good, but perform fantastically.

We built Outerform AI to take advantage of these principles, so your forms look and feel great right out-of-the-box. Take the time to refine your form design to match your brand or style, and watch as user engagement and response rates soar.

Start building better forms today