3twenty9 offers front-end web application design and development services to help your enterprise team launch the next big project. Our HTML5 single page web applications (SPAs) rely on the latest proven JavaScript frameworks like React, Angular or Vue.

Design Process, Principles and Patterns

We at 3twenty9 are an effective team of web designers and developers prepared to deliver your responsive web application. We begin by working with your team to define a workflow for all the stakeholders involved with the project – a well defined methodology is key to the success of any solution. Below you will find some of the steps we take to plan and deliver an enterprise solution like the AccuWeather Portal.

Knowing Our Users

A successful user interface focuses on users and their tasks. When identifying your users, we keep in mind that clients and stakeholders are not always users, and you are not a user.

We employ several techniques to identify users:

• User interviews
• Business stakeholder interviews
• “Shadowing” method of observation
• Card sorting

Becoming customer-centric means looking at an enterprise from the outside-in rather than the inside-out – that is, through the lens of the customer rather than the producer. It’s about understanding what problems customers face in their lives and then providing mutually advantageous solutions. *source

Interviews can provide answers to questions about the users’ knowledge of the system and computers in general, while shadowing can yield more detailed information about how users perform tasks and what errors they make. The method is called shadowing because the observer is like a shadow, watching and noting the steps a user takes.

Task Analysis helps identify what tasks users perform in their jobs, how they do them, how long they take, and what errors they make. We can monitor existing applications and observe how users interact with them. Understanding tasks and challenges in as much detail as possible helps us design the best solutions.

Organic Design Process

We suggest the Agile approach to designing user interfaces and web applications. Why, you ask? Well, because for users and clients, the user interface is the product. The bottom line is that they don’t care about sketches or powerful servers. Clients want to see solutions packaged nicely and accessibly in your web product.

So, how does Agile help? It helps through its key principle: the iterative approach. Each iteration consists of all of the phases defined by your process. This means that at the end of the first iteration, you will have a product that can be tested – a prototype.

• Sketching is a powerful way to explore ideas. The goal is to arrive at the solution by sketching out different concepts. Most sketches will be thrown out, but that's okay. Sketches are fast to create and easy to dispose of, which is why they are so powerful.
• Prototypes can simulate the real application. A prototype can contain one or more features. It merely simulates the behavior of a real application, but enables users to experience something.
• Prototypes are useless unless you test them. You will use this information as the basis of another iteration of sketching, prototyping, and testing. We do this at least until major issues have been fixed. We all know that software projects are tight on time and budget, so to be more efficient, test early and test often.

3twenty9 has experience with Scrum, an iterative and incremental agile software development methodology for managing product development. We often work as our own scrum team, but can also adapt our workflow if it benefits the project. Our preferred project and code management tools are Slack, Phabricator, JIRA, Bitbucket or Github.

Design Principles

Key factors in a good UI are consistency and familiarity. Consistent user interfaces have a shorter learning curve because users will recognize parts of the system and be able to fall back on prior experience with the web.

• Internal Consistency – a user interface should be consistent across all parts of the application, from navigation to color to terminology.
• External Consistency – a user interface should also be consistent within its context, such as the operating system or other applications in its group or family. A typical example is the applications in the Microsoft Office family.

Efficient and enabled users focus on completing tasks in the easiest and fastest way possible.

• Task analysis helps us identify tasks and determine how users perform them. If tasks are long, we accelerate them by breaking them up into smaller units.
• Users who can personalize an environment will learn it faster and, more importantly, will be more confident using it.
• Increased efficiency through keyboard support and shortcuts on the desktop. It is inefficient for a user to have to switch back and forth between mouse and keyboard.

Every UI can be helpful. An interface should provide meaningful feedback that describes the state of the system to users.

• Error occurs – users should be notified and informed of ways to recover.
• Operation is in progress – users should be notified about the progress.
• Event finished successfully – users should be notified of completion.

The application should prevent users from making errors and be forgiving.

• Confirmation dialogs
• Forgiving input formats
• Undo options

A comprehensive help system is just as important as a simple UI.

• Inline help
• Knowledge Base
• Guided Tours (videos, images, text)

Satisfaction is a subjective term that refers to how pleasant an interface is to use. Every design principle affects satisfaction.

• Simplicity is a basic principle of UI design. The simpler a user interface, the easier it is to use. The key is to balance functionality and simplicity.
• Restraint is one of the most efficient ways to achieve a balance. Our goal is to find the simplest way to solve each business problem.
• Aesthetics play an important role in overall satisfaction. Users respond positively to pleasing user interfaces, sometimes even overlooking missing functionality.

“Designing user interfaces for business web applications is a challenging job that is full of compromises. You have to make compromises between client and user needs; business requirements and users; novice and expert users; functionality and simplicity. It requires a solid understanding of users and their tasks, as well as of UI design principles and patterns.” — Janko Jovanovic