Why a Lean UX Design Process?

Design is a marketing tool. The best marketing tool you can have is a well-designed product.
Annie Wang

How do you create a well-designed product? By focusing on solving the right problems and delivering value to your customers. A Lean UX Design process gives you the tools and system for developing a well-designed product.

Why A Lean UX Design Process

In Designing with Lean UX, Kate Kutter describes UX as

  • a mindset
  • focused on delivering value
  • inspiring the right kind of ideas
  • guides your decisions

What is Lean UX?

In A Lean Design Process for Creating Awesome UX, Annie Wang described Lean UX as a repeatable process that is goal-driven and outcome-focused. Your team has a designer, developer and product manager. Most startups are going to have small teams. They focus on the following principles:

  • Rapid cycles: think, make, check
  • Generate many options and decide quickly which ones to develop
  • Focus on solving the right problems
  • Recognize hypothesis and validate with user feedback
  • Research with users as the best source of information and inspiration

What does a Lean UX Design process look like?

A typical UX Design Process may incorporate the following:

  • Discovery
  • Wireframe
  • Prototypes
  • Validate Internally
  • Summarize
  • Iterate

In Lean UX, Lean doesn’t equal Skinny. Less is more.  You want to build a product that is simple and clear with less features and more details. You want to go through cycles of Think, Make and Check. The key is user feedback and to reduce cycle time, not your build time. Not every product needs to follow the same UX Design Process.

As we develop our own UX Design process, we want to focus on thinking, making and checking. User feedback is key to making products that are simple, clear and easy to use.

Have you created your own UX Design Process?

7 UX Tips for Developers

The success of your website or app depends on creating the best user experience possible. Not all developers have a designer available to help with the design.

7 UX Tips for Developers

You can use the following 7 UX tips to create a better experience for your users:

Prioritize features

When you create a new website or app, you need to decide what features to add, leave out and improve. Prioritizing makes it easier to create a website or app with the right amount of features and helps you to focus on getting it built.

Speed things up

Make sure your website or app is fast and responsive. A page or app that takes to long to load will loose users. Make it as fast as possible to ensure an enjoyable user experience.

Design before you code

Sketch your designs with pen and paper or other prototyping tools. Show your designs to users or even team members. Get their feedback before you write any code. It is easier to change a design before you start writing code. Here’s how you do a UX Design Process:

Track data

Use Google Analytics or other analytic software to help you learn more about your users and how they use your app or website. The more you know, the better decisions you can make when improving your app or website.

Make your UI simple and easy to use

Easy said than done. How do you make the UI better? Keep it clean and consistent. Use readable fonts. Choose larger font sizes and avoid fancy fonts like script or handwriting fonts. Make your navigation simple. Use standard icons and words that people recognize.

Remove or prevent extraneous features

Be ruthless when considering new features. Ask does this feature solve a need? Will majority of our users want it? If you have older features that no one uses, reconsider whether or not you should keep them.

Show informative error messages

Write error messages that tell the user what happened and what to do next. Good error messages can help make your website or app easier to use. Bad error messages only frustrate and irritate users.

When people can’t figure out how to use a website or app, they leave or delete the app. If you want to prevent people from abandoning your app or website, use these tips to make it better.

What tips would you add?

5 Places to Get WordPress Snippets

How can you modify your WordPress website? By adding a theme, plugins or modifying WordPress yourself. When you develop your own WordPress websites, you may want to add code instead of relying on a plugin. Adding a code snippet to your theme or a custom plugin can be a better solution than searching for a plugin that does what you want. Where do you find these code snippets, what do you do if it breaks your site and how to do manage them?

5 Places to Get WordPress Snippets

Where do you find code snippets?

WPSNIPP

WPSNIPP – WordPress Snippets has a collection of about 666 snippets. You should be able to find a snippet that works for your next project.

wpsnipp

 

Digging Into WordPress

Digging Into WordPress has tips, tricks and snippets for modifying and making your WordPress site even better. You can use their tips and tutorials to replace plugins that could do the same thing.

Digging Into WordPress

 

WP-Mix

WP-Mix is a mix of code snippets and tutorials. You will find WordPress, PHP, jQuery, HTML, CSS and more.

WP-Mix

 

CSS-Tricks

CSS-Tricks has a collection of WordPress snippets. You can add these snippets to your theme or a site-specific plugin.

CSS-Tricks WordPress Snippets

The Web

You can search the web for a code snippet. Many WordPress or developer blogs will have code snippets that you can use.

What happens when you find one and it breaks your site?

WP Beginner explains how to paste snippets from the web into WordPress and how to avoid mistakes that could take your site down.

What do you do with your code snippets?

Whether you have written or found a WordPress snippet that you want to share, you need a way to do it. Thoriq Firdaus show you how in How to Manage and Use Snippets in WordPress.

Code snippets can make it easier for you to modify WordPress. You can search and paste snippets into your WordPress site. Where and how you paste these snippets can determine whether or not it will fix your problem or crash your website. As with all code you find, read it to make sure you understand what it does and test it. Do you have a place where you can find WordPress code snippets?

5 Blog Post Title Generators

How do you get ideas for your blog? Some ideas are easier to write about than others. Other times, you can’t think of anything. What can you do? You can use a blog post title generator. Post Title Generators can give you ideas to help get you writing.
5 Blog Post Title Generators

What kind of generator are you going to use? You can use a generator that allow you to enter topics and return a list of post titles for you. Or you can use a fill in the blank post generator. They may ask you for a topic or ideas that fits within the provided sentence and then give you one or more suggestions.

Hubspot’s Blog Topic Generator

Hubspot’s Blog Topic Generator asks you for three nouns and generates 5 potential blog topic posts. If you don’t like the results, you can enter different nouns.
Hubspot Post Title Generator

 

Tweak Your Biz – Title Generator

Tweak Your Biz – Title Generator is simple. You enter a topic. Select whether it is a noun or a verb. Click on Submit and it generates post titles separated by categories. If you like the list, you can copy, print or download your titles from the available box that provides them all.
Tweak Your Biz TItle Generator

Portent’s Content Idea Generator

Portent’s Content Idea Generator ask you for a subject. It generators one content idea. You can enter the same subject as many times as you like until you get an idea that you like.
Portents Blog Title Generator
Portents Content Idea Generator

The Blog Post Ideas Generator

The Blog Posts Generator by Build Your Own Blog gives you one idea. You don’t enter a topic idea. Instead you click the Generate Blog Post Idea button and you get an idea to start from.
Blog Post Idea Generator

When I tried out the tool, I got:

  • How to Survive Your First…
  • Top X _____ Mistakes You Must Avoid
  • How to _____ Like a Boss
  • How To Solve The Biggest Problem you had with…
  • Creative Ideas to Help You…

Blog About by Impact

Blog About By Impact gives you a theme to start with. You can start with their suggested theme or hit the refresh button to get another theme. If you like the theme, you click on Next.
Blog About By Impact

It takes you the post ideas section. You get an idea that you can fill in the blank. If you like the results, click on the heart to add it to your writing list. Then, you get another post title to complete. When you have a list of ideas that you like, you can email them to yourself.

As you continue to write in your blog, you may find that getting ideas for it can be a challenge. Blog Post Title Generators can help you to create ideas that you want to write about. Whether you like getting a list of ideas or a fill in the blank style, they can be a useful tool to add to your blog writing routine.

Have you used a blog title generator?

Tools for Building an One Page Website

You need to build an one page website. How do you go about building one? Do you use specific tools? You can chose to build a landing page with a pre-built template that you customize or build your own from scratch. The best way to learn a new set of tools or a framework is to build your own. I choose to build a new website with Bootstrap and LESS.
Tools For Building One Page Website

What type of website?

One page portfolio for a Developer. I sketched out on paper a basic design.
Developer Portfolio Template Sketch

When building a new website, you have to make a lot of design decisions. For this project, I am focusing on choosing colors, fonts and images.

How do you choose the colors?

For inspiration, I looked books that I own. I selected one with a color scheme that I liked. Next, I used a Material Design Generator to create a color palette. For this project, I used coolors.co and selected a color palette similar to the book cover.
Coolors Color Palette

What fonts are you going to use?

You want to pick fonts that work well with your website’s content. You can use these tools to help pick fonts that look good together. fontpair.co or 20 Inspirational Free Resources for Better Typeface Pairing Or if you want to experiment, use fonts.google.com to find a font you like and look at the recommended pairings.

For this project, I decided to use: Julius Sans One and Crimson Text. I found it on https://femmebot.github.io/google-type/.

Where do you get images from?

Do you take your own photos or get them from a stock photography website? Whenever you can, you want to customize your website with your own custom photography. Not all projects give you the time to create your own photos. When you can’t create your own photos, you can use stock photography from different web collections. I like to get stock images from pixabay for my projects. I picked out a hero image and several support images for this project.
Binary Background

What was the result?

It didn’t work out. The color scheme and hero image seemed too busy, red and angry. So, I decide to look for a better hero photo. The one I chose wasn’t working. I tried a couple of different photos. I found one that I liked better, but it didn’t fit the existing color palette. The next step was to change the color scheme slightly. I picked out two colors in the photo that looked good with the other colors in the color palette. I changed the CSS to see how the new colors worked. They looked much better. The newer version of the website works better than the original.
One Page Programmer Final

As web developers, we make decisions that affect the design and functioning of a website. Not all decisions work. Sometimes, you have to make changes that affect the design for the better. You may even have to change your approach in order to make a website or app an reality. Have you ever had to make minor changes that improved your original design?