News

UI Design Best Practices and Common Mistakes

This post was written by Micah Bowers, Designer for Toptal.

 

Although the title UI designer suggests a departure from the traditional graphic designer, UI design is still a part of the historical tradition of the visual designdiscipline.

With each movement or medium, the discipline has introduced new graphic languages, layouts, and design processes. Between generations, the designer has straddled the transition from press to Xerox, or paper to pixel. Across these generations, graphic design has carried out the responsibility of representing the visual language of each era.

As UI design transitions out of its infancy, what sort of graphic world can we expect to develop? Based on the current trajectory, the future looks bleak. Much of UI design today has become standardized and repeatable. Design discussions online fixate on learning rules to get designs to work safely rather than pushing the envelope or imagining new things.

The tendency for UI designers to resort to patterns and trends has not only created a bland visual environment, but it has also diminished the value of the designer as processes become more and more formulaic.

As we review UI best practices and common mistakes, the most pressing concern is not technical proficiency but avoiding an onslaught of repetitive and visually boring designs.

The top five most common UI design mistakes are:

  1. UI designers have become rule-obsessed.
  2. The grid is restricting the creative process of UI designers.
  3. UI design has been standardized with patterns.
  4. Typefaces are tragically misunderstood.
  5. Contrast is not a design cure-all.

Best practices for interface design

Understand principles and be creative within their properties. Following rules will only take you where others have been.

Common Mistake #1: UI Designers Have Become Rule-obsessed

The world of graphic design has always followed sets of rules and standards. Within design disciplines, common mistakes closely coincide with a standard rule that has been broken. From this perspective, design rules appear to be trustworthy guides.

However, in every design discipline, new movements and creative innovation have resulted from consciously breaking rules. This is possible because design is conditional and requires designer discretion. Design is not a process with finite answers. Therefore, design rules should be considered as guidelines rather than cold, hard facts. The experienced designer knows and respects the rule book just enough to be able to break out of the box.

The way design is discussed online often revolves around lists of do’s and don’ts. Master the 10 Easy Steps to Design Perfection! Unfortunately, design requires a much more robust understanding of principles and tendencies. The path to good design does not run through systematic adherence to checklists.

Interestingly, if designers stop breaking rules, then no creative breakthroughs can be made. If UI designers only develop the ability to follow guidelines rather than honing their decision-making abilities, they may quickly become irrelevant. How else will we argue that our work adds greater value than off-the-shelf templates?

Be Wary of “Top 10” Design Rules

The issue with design rules in today’s world of UI design is their abundance. If designers need to solve problems, they can simply look to the existing UI community and their set of solutions. However, the plentitude of these guides and rules undermine their credibility.

A Google search for “Top UI Design Mistakes” yields a half million results. What are the odds that most, if any, of these authors agree with one another? What is the likelihood that each design tip offered accurately coincides with the design problems of a reader?

Often, online educational articles discuss acute problems rather than the guiding design principles behind an issue. The result is that new designers never learn why design works the way it does. Instead, they become dependent on what has come before. Isn’t it a concern that so few of these articles encourage design experimentation or play?

Designers should draw on a toolkit of guiding principles rather than a book of predetermined rules and design templates. “Press x for parallax scrolling and y for carousels. Before choosing, refer to the most recent blog post on which navigational tool is trending.” B-o-r-i-n-g-!

Trends are like junk food for designers. Following them produces cheap solutions that offer some initial payback but little value over the long haul. Trend-following designers date themselves quickly. The reward for following someone else’s design path? A gnawing sense of professional emptiness.

It’s true that working to invent your own styles and systems is hard work, but it’s absolutely worth the effort. The daily gains and breakthroughs are all your own. There’s something about copying that never seems to feed the designer’s soul.

Common Mistake #2: The Grid Is Restricting the Creative Process of UI Designers

Despite my rant against rules, here’s one: It’s impossible for a UI designer to work without a grid. Web and mobile interfaces are fundamentally based on pixel-by-pixel organization—there’s no way around it.

However, this does not mean that UI designers should only strive for grid-centric appearances. Likewise, there’s no reason for all design-related decisions to be based on a grid.

Avoid Using the Grid as a Trendy Tool

Generally, designing in response to trends results in poor design. At best, trends lead to satisfactory outcomes, but the overall impact is almost certain to be underwhelming. To be trendy is to be ordinary.

Therefore, when employing a grid in a design, understand what the grid has to offer as a tool and what it might convey. Grids generally represent neutrality as everything within the constraints of a grid appears equal.

Grids also allow for an unbiased navigational experience. Users can jump from item to item without any interference from the designer’s curatorial hand. With other navigational structures, the designer may be able to group content and establish desired sequences more intentionally.

UI design best practices and tips and tricks

Although a useful tool, the grid can be very limiting to designers.

Don’t Default to the Grid as a Workflow

Dylan Fracareta, faculty at Rhode Island School of Design (RISD) and director of PIN-UP Magazine, points out that “most people start off with a 12-column grid…because you can get 3 and 4 off of that.” The danger here is that designers immediately predetermine their work.

To prevent this, Fracareta only uses the move tool with set quantities, as opposed to physically placing things against a grid line. This has the double effect of establishing order and opening up the potential for unexpected outcomes.

Designing for the browser used to mean that we would input code and wait to see what happened. Nowadays, web design is similar to traditional layout design, where the process is “more like adjusting two sheets of transparent paper.” How can we, as designers, benefit from this process?

Although grids can be restrictive, they are one of our most traditional forms of organization. The grid is intuitive. The grid is neutral and unassuming. Grids allow content to speak for itself and users to easily navigate an interface. Despite my warnings towards the restrictiveness of grids, different arrays allow for varying levels of guidance or freedom.

Common Mistake #3: UI Design Has Been Standardized with Patterns

The concept of standardized design elements predates UI design. Architectural details have been repeated and applied to similar design circumstances for centuries. This practice makes sense for parts of a building that people rarely perceive.

However, once architects standardized common elements like furniture dimensions and handrail heights, people began to express disinterest in the beige physical environments that resulted.

UI architecture best practices

Once considered best practice in the field of architecture, we now realize that row after row of standardized office furniture made for an agonizing work environment.

Not only this, but standardized dimensions were proven to be ineffective. Based on statistical averages, they often failed to serve large segments of the population. Repeatable details have their place, but they should not be used uncritically.

Designers Shouldn’t Use Patterns as Products

Many UI designers view patterns as something greater than a simple time-saving tool. They see them as off-the-shelf solutions to complicated design problems. Patterns are intended to standardize recurring tasks and artifacts in order to make the designer’s job easier. Regrettably, certain patterns like carousels, pagination, and F-patterns have become the entire structure of many of our interfaces.

Is Pattern Use Justifiable?

Designers tell themselves that the F-pattern exists as a result of the way that people read on the web. Espen Brunborg points out that perhaps people read this way as a result of our F-pattern overuse. “What’s the point of having web designers if all they do is follow the recipe?” Brunborg asks.

Common Mistake #4: Typefaces Are Tragically Misunderstood

Many “Quick Tips” design lists suggest hard and fast rules for fonts. Each rule is shouted religiously, “One font family only! Monospaced fonts are dead! Avoid thin fonts at all costs!” This is nothing more than hot air.

The only legitimate rules on type, text, and fonts center on enforcing legibility and conveying appropriate meaning. As long as the text is legible, there may be opportunities to employ a variety of typefaces. The UI designer must take on the responsibility of knowing the history, uses, and design intentions for each font implemented in an interface.

Typeface Legibility Reigns Supreme

Typefaces convey meaning and affect legibility. With all of the discussion surrounding rules for legibility on devices, designers are forgetting that type is designed to imbue a body of text with an aesthetic sensibility. Legibility is critical—this isn’t to be disputed—but it really should be an obvious goal. Otherwise, why would we have a need for anything beyond Helvetica or Highway Gothic?

The important thing to remember is that fonts are not just designed for different contexts of legibility. They are also essential for conveying meaning and giving bodies of text nuanced moods.

UI design tips and tricks for typography

Each typeface is designed with its own use case in mind. Don’t allow narrow rules to restrict an exploration of the world of type.

Avoiding Thin Fonts at All Costs Is Unwise

Now that the trend has come and gone, a common design criticism advocates avoiding thin fonts entirely. But do we need more regulations? Shouldn’t the goal be a deeper understanding of the design principles supporting typefaces?

Some designers are convinced that thin fonts are impossible to read or untrustworthy between devices. Legitimate points. Yet, this represents a condition in the current discussion of UI design where typefaces are only understood as a technical choice relating to legibility. If legibility is the only design concern, why not banish thin fonts altogether?

A more holistic approach begins with understanding why a thin font might be advantageous, and within what contexts. Bold, thick text is actually much more difficult to read at length than thinner text. Yet, as bold fonts carry more visual weight, they’re more appropriate for headings or content with little text.

Thin fonts often employ serifs, making them suitable for body text. How so? Serif characters flow together when viewed in rapid succession, making them more comfortable for long periods of reading.

Additionally, thin fonts are often chosen because they convey elegance. If a designer is hired to create an interface for a client whose mandate is visual sophistication, it would be difficult to find a heavier typeface to do the job.

Fonts Require Variation to Establish Hierarchy

A common UI design mistake is failing to provide adequate variation between fonts. Changing fonts is a good navigational tool that helps to establish a visual hierarchy within an interface. In general, the largest items (or boldest fonts) are most important and carry the most visual weight. Visual significance helps users identify content headings and frequently used functions.

Too Much Variation Undermines Hierarchy

The issue with making every font choice unique, especially when an interface contains many typefaces, is that nothing really stands out. If every font is different, it becomes difficult for users to recognize important content or establish a sense of visual order.

Common Mistake #5: Contrast Is Not a Design Cure-all

A common thread that appears on many “Top Mistakes” lists encourages UI designers to avoid low-contrast interfaces. It’s true that there are many instances in which low-contrast designs are illegible and ineffective. However, my worry, similar to my points on thin fonts, is that the use of absolute language leads to a homogenous, high-contrast design culture.

Defaulting to High Contrast Is Careless

High contrast visuals are undeniably stimulating and exciting. However, there are many more states within the human emotional range worth conveying. To be visually stimulating may also be visually safe.

Take, for instance, the entire industry of contemporary sci-fi film. It seems as though every production has resorted to black and neon blue visuals as a way of tricking viewers into excitement. Would it not be more effective to interweave narratives with both high and low contrast images that provoke a broader scope of emotional responses?

Functionally, if every element in an interface is in high contrast to another, then nothing stands out. This defeats the potential value of contrast as a hierarchical tool. Considering different design moves as tools, rather than rules, is essential to avoiding stagnant, trendy design.

Conclusion

At best, design rules are guides. They provide decision-making safety and warn designers of the dangers of thoughtless choices.

Conversely, design rules are not laws. They are not unbreakable, and they are certainly not deserving of our undisputed surrender. In fact, design rules, when followed recklessly, can become serious crutches that weaken our ability to solve problems creatively.

Designers are not scientists. We are not bound to provide empirical evidence for every aesthetic decision we make. It’s true that our profession is one of process and deliberate judgments, but there is room for instinct and ingenuity. In fact, our ability to help our clients stand out in a cluttered world of trendy content depends on our willingness to imagine new possibilities.

We must experiment. We must play.

Design rules exist to be leveraged for visual advantage. They may be bent, even broken, but they are never to be blindly followed.

No comments
Michelle YoungUI Design Best Practices and Common Mistakes
read more

Master Your Craft with These Top UX Tools

This post was written by Olha Bahaieva, Designer for Toptal.

 

Having the right UX tools at hand can be the crucial difference between having a collaborative, seamless, and overall highly effective design workflow and a workflow that’s slow, unproductive, and unaccountable.

It’s important to stay up to date with the latest tools and technologies, and learn about the interesting ways designers can use them to create and collaborate more efficiently. Some tools are more effective than others depending on the size of the team, the stage in the design process, and any other tools that are already part of the workflow.

Let’s take a look at the top UX tools, from wireframing and prototyping to UX research and analytics, that are helping teams do incredible things in 2018.

Design + Prototyping + Design Handoff Tools

InVision/InVision Studio

Platform: web (integrates with Sketch and Photoshop), and macOS
Price: from $13/month for individuals, or $89/month for teams of five

Note: The price applies to the core InVision web app, not InVision Studio, which is free.

One of the best UX tools: InVision

The InVision web app displaying the status of various app screens

InVision is arguably the mightiest UX tool yet. It allows Sketch and Photoshop designers to import their static screens and turn them into dynamic prototypes, and stakeholders to offer constructive feedback that can then be converted into actionable, manageable tasks. Combine that with their user testing and collaborative whiteboard technology, and the InVision web app becomes an invaluable, seriously impressive, tool.

In 2017, InVision shipped new design handoff features, and now in 2018, InVision has has become a complete, all-in-one solution as they introduce their own UX design tool, Studio, which is free and includes advanced animation and prototyping features.

For teams that want a fully-stocked toolbox under one subscription, InVision is here.

InVision Studio, a free UI design tool and a great addition to the design process

Studio, InVision’s new UX design tool

Framer/Framer Studio

Platform: macOS
Price: $12/month for individual users, or from $250/month for teams of three

One of the best UX tools: Framer Studio, a UX prototyping tool

In terms of offering, Framer is the tool that most closely resembles InVision, since they both combine a mature web interface with a brand new UX design tool. It comes down to personal preference with these two, but where Framer is slightly cheaper for individuals, InVision is clearly the bigger brother when it comes to design collaboration.

Figma

Platform: web, macOS, and Windows
Price: free for starter teams, or $12/month

Another great prototyping tool: Figma

Figma stood out from the rest early on in its development as the leading tool for multiplayer design, allowing multiple designers to work on the same design file all at once. With the ability to create responsive designs and added handoff features, it’s impressive how they’ve offered these features across the web, macOS, andWindows versions of the product.

If you enjoy an energetic, collaborative design workflow, Figma is for you.

Adobe XD

Platform: Windows and macOS
Price: free for 1 prototype, or $20.99/month for unlimited prototypes

One of the best UX tools: Adobe XD

When Sketch became the #1 tool for wireframing and interface design, Adobe almost had no choice but to admit that Photoshop could never be the UI design tool that designers needed. Adobe decided to make Adobe XD available to Windows users where Sketch didn’t, and also built in the ability to prototype user flows and inspect designs, helping veteran designers familiar with the Adobe ecosystem to stick with a familiar workflow.

UXPin

Platform: web
Price: from $8.10/month for one user, with other options for teams

A great wireframing and collaboration UX tool: UXPin

UXPin is a complete product design platform offering everything from design, wireframing, prototyping, collaboration, user testing, and handoff all in a single web application. The downside is that UXPin is one of the more difficult tools to use due to the number of features, cluttered interface, and (sometimes) performance lag that often haunts bulky web apps. However, enterprise teams in need of impressive features such as design systems and the ability to take advantage of web frameworks and technologies such as Bootstrap and Google Fonts shouldn’t overlook it too quickly.

Design + Prototyping Tools

Sketch

Platform: macOS
Price: $99/year

One of the best design, wireframing, prototyping UX tools: Sketch

Photoshop handed the crown to Sketch as they became the leading design tool for both wireframing and interface design in 2015, and as of 2017 they’re still leading the charge. Sketch’s innovative approach to screen design introduced invaluable features such as artboards, symbols, and exports, that would then inspire a wave of new design tools like Adobe XD, Framer Studio, and InVision Studio. This incredibly-intuitive (and lightweight) vector tool helps UI designers iterate much faster than ever before.

However, here’s the “but” (and it’s a big but): Sketch isn’t available for Windows, and their decision to implement tools for prototyping designers so late in the game means that their competitors have quickly taken over this market, with InVision being arguably the most dynamic prototyping tool available today. Even though Sketch functionality can be tailored with an impressive catalogue of plugins (including integrations with the likes of Flinto, Zeplin, Marvel, Principle, and even InVision themselves), some designers may favor a more native experience with these features readily available out of the box.

All in all, Sketch is excellent for ideation and wireframing, or those that don’t mind topping up their toolbox to add better prototyping and collaboration tools.

Webflow

Platform: web
Price: a variety of options aimed at single-site individuals, multiple sites, and teams

Webflow is used to create responsive websites online

Webflow is a WYSIWYG editor for the modern-day designer who wants to build responsive websites without code, and even host them, all with a single subscription. Webflow outputs clean, semantic code so that you don’t have to, and delivers robust features that lets web designers create anything from static websites to eCommerce stores, where even the content and inventory is managed from the same dashboard.

Principle

Platform: macOS
Price: $129/year

Principle is one of the best app prototyping tools

Although more of a prototyping tool than a design tool, the highly-rated Principle app is for designers that focus on high-fidelity prototypes, and uses timeline animation to help design advanced micro-interactions where Sketch and Adobe XD don’t. If the design features aren’t sophisticated enough for your needs, Principle integrates with Sketch.

Prototyping Tools (Only)

Flinto

Platform: macOS
Price: $99/year

Flinto, one of the cheaper prototyping tools for macOS

Flinto takes transitions and micro-interactions to the next level with advanced animation tools, including springs and easings, 3D rotation, scrolling effects, and even allows trendy designers to export animations as videos, GIFs, and Dribbble shots.

While Flinto is focused solely on prototyping interactions, it does it well. Pair with Sketch for best results.

Origami

Platform: macOS
Price: free/open source

Origami, an app prototyping tool made by Facebook

Origami is an app prototyping tool developed by the design team at Facebook. While it’s similar to Flinto (minus the price tag), it’s not maintained as often as similar tools, and its logic-based approach to designing interactions results in a steeper learning curve.

For designers on a budget, Origami is well worth a look.

Prototyping + Design Handoff Tools

Marvel

Platform: web
Price: $0-12/month for individuals, or $42-84/month for teams

Enterprise teams requiring SSO and handoff features should __inquire directly_._

Marvel, an easy-to-use online prototyping tool

Marvel is an online prototyping tool known for being one of the easiest to master, however, the trade off is that it’s not as sophisticated as InVision when it comes to dynamic prototyping features, and requires integration with Sketch to become a complete design + prototyping solution. That being said, it does integrate with Lookback, bringing user testing to the table, and includes design handoff features.

Marvel also allows teams (even non-designers) to choose an artboard and illustrate a low-fidelity idea using shapes and text, making it ideal for design sprints (especially since it also lets users convert paper prototypesto low-fidelity Marvel prototypes).

Design Handoff Tools (Only)

Zeplin

Platform: web
Price: free for one project, $17/month and $26/month for three and 12 projects respectfully

For large organizations, their $7.65/user/month option offers more advanced user permissions and the ability to copy color and text styles between projects.

Zeplin allows seamless design handoffs for Sketch users, helping the design process.

Zeplin has consistently outperformed competitors Sympli and Avocode, where it has recently added Adobe XD and Figma integrations alongside its already-existing Sketch and Photoshop CC integrations. While many all-in-one tools have added design handoff to their list of features, Zeplin fills the void for the tools that haven’t (Sketch, Photoshop), and those still experimenting with handoff features (Adobe XD, Figma).

Wireframing + Prototyping Tools

Axure

Platform: Windows and macOS
Price: $29/49/99/user/month for Pro/Team/Enterprise users respectively

One-time purchases of Axure RP 8 also available from $495.

Axure is one of the best wireframing and prototyping tools.

Axure is built specifically for the design of wireframes and rough prototypes, and comes with features that make creating data-driven, dynamic, and adaptive mockups so easy you’ll forget that it’s a tool with no high-fidelity UX prototyping features. For designers focusing solely on wireframes and prototyping, Axure is a top choice, used by 87% of the Fortune 100 companies.

Justinmind

Platform: Windows and macOS
Price: $19/user/month, or $39/user/month for enterprise teams

Justinmind, one of the best prototyping tools for wireframing

Justinmind doesn’t receive enough love for what it offers, which is advanced UX prototyping, collaboration, some basic design tools, and also 500+ web and mobile widgets for wireframing. Wireframing isn’t something that many competing prototyping apps have focused on, making Justinmind one of the few UX tools that does.

Wireframing Tools (Only)

OmniGraffle

Platform: macOS
Price: $100, or $200 for a Pro license

Omnigraffle is a mockup tool for creating wireframes and diagrams for the UX design process.

OmniGraffle is a wireframing tool with diagramming features, useful for apps and websites where the user flow or information architecture might need more attention. As a native macOS app, the interface is very friendly, making it an easy UX tool to master.

OmniGraffle has a very handy feature: “stencils,” that are ready-to-use, drag-and-drop reusable design components in a “stencil library” which designers can use for building wireframes, mockups, or even final visual designs. Users can create their own library, and there are also thousands of stencil libraries available on the web for download, a lot of them free, saving time and effort.

Graffletopia is one of the largest stencil depositories on the web containing a mix of free and paid libraries. With over 1,100 stencils, Graffletopia has stencils for every use—designing mobile apps, websites, network diagrams, flowcharts, and more.

Balsamiq

Platform: web, macOS, and Windows
Price: from $90/user/year for cloud access, or $89 for the desktop apps

Balsamiq is one of the best UX tools for creating low-fidelity wireframes.

Balsamiq is the opposite of Justinmind, focusing more on wireframing than prototyping. Their built-in UI elements use a sketched-out visual aesthetic to encourage brainstorming, and is uniquely aimed at product managers and developers, as well as wireframing designers, allowing entire teams to be a part of the design process early on.

UX Research and Testing Tools

Lookback

Platform: web
Price: $49/user/month or $99/user/month depending on features

Lookback, one of the easiest user testing tools to master

Lookback introduces live, moderated user testing to the UX design process, allowing designers to record the face, screen, and voice of anyone in the world. For teams using Marvel as their prototyping tool, Lookback integrates with it seamlessly.

UserTesting

Platform: web
Price: $49/test (min. 15 tests), with enterprise options available

UserTesting, arguably the best user testing tool

UserTesting is similar to Lookback in terms of features. Although it’s a terrific standalone user testing tool with a huge repertoire of experienced user testers (with Marvel you’ll need to find user testers yourself), UserTesting seamlessly integrates with InVision, too.

Eyequant

Platform: web
Price: $499/month for individuals, $999/month for teams of 10 (+ enterprise options)

Eyequant uses machine learning to improve CRO.

Eyequant uses machine learning to help teams make better design decisions and improve their CRO efforts. Its hefty price tag might deter some customers, but those that do invest receive training on how to simulate users, analyze metrics, make the most of their A/B testing, and more.

Hotjar

Platform: web
Price: variable pricing depending on number of daily pageviews

Hotjar is the leading tool for heatmaps that helps the design process.

Hotjar makes it easy for teams to optimize user experiences by combining user feedback with analytics, heatmaps, clickmaps, scrollmaps, and visitor recordings. Where heatmaps and clickmaps illustrate where users are moving and clicking their mouse respectively, scrollmaps indicate at which point users might be losing interest.

Crazy Egg

Platform: web
Price: from $29/month for 20,000 pageviews

Crazy Egg combines A/B testing and analytics for the best UX design process.

Similar to Hotjar, Crazy Egg is used to optimize user experiences and conversion rates by analyzing user behavior with heatmaps and visitor recordings, although it also includes easy-to-use A/B testing tools to help decipher what is and isn’t working.

Optimal Workshop

Platform: web
Price: $166/user/month, with free and enterprise options available

Optimal Workflow is one of the best user research tools.

Optimal Workshop is a user research toolkit focusing on card sorting, surveys, tree testing, first-click testing, and qualitative data discovery.

Analytics Tools

Google Analytics

Platform: web
Price: free

Google Analytics is the #1 website analytics tool.

While Google Analytics doesn’t sport the most inspiring or most usable interface, it does deliver a fair amount of data for a free tool, making it a suitable starting point for user research and acquiring insights that you might want to explore further in another tool.

Mixpanel

Platform: web
Price: from $99 per 1 million data points, with free and enterprise options available

Mixpanel, a popular website analytics tool for user research and the UX design process

Mixpanel allows anyone, from executives to simple contributors, to use data to make more strategic decisions. With a friendlier interface compared to Google Analytics, designers might find that it’s easier to analyze user journeys, learn how users engage with the product, and decipher complex behavioral analysis with Mixpanel.

Pendo

Platform: web
Price: pricing is determined based on the number of users and features required

Website analytics tool, Pendo, helps the UX design process.

Pendo, with a much simpler interface compared to most other analytics tools, allows designers to track NPS (net promoter score), segment users, optimize funnels and user journeys, and anything else you’d expect from a top website analytics tool. Besides that, designers can deliver targeted announcements, contextual help, and tailored experiences based on the data that’s been tracked.

Conclusion

Choosing the right UX tools requires careful consideration. We need to factor in the costs, the required level of collaboration with other designers and stakeholders, the platform, and any other tools that we might need to integrate with in order to maintain a seamless workflow. Once you’ve narrowed down your choices, sign up for their free trials and consider running a 5-day design sprint to test the waters.

No comments
Michelle YoungMaster Your Craft with These Top UX Tools
read more

6 Essential Content Marketing Goals for Professional Bloggers

If you are a professional blogger you will understand it’s better than anyone else that content is the most important part of your blog. However it is not content alone that makes a blogger successful.

The content has to be written to address a target audience and promoted well so that it actually reaches the public.

A good writer cannot necessarily become a successful professional blogger. That’s because in this age of technology things are changing faster than ever. With new algorithms and SEO tricks many good blogs and websites fail to appear top on search results with good content while many make the most of it by keeping track of some basic facts.

Becoming a professional blogger is not a piece of cake and content marketing especially demands some planning. Here in this article we will talk about six essential content marketing goals for a professional blogger.

1. Understand your needs.   

The first and the most important goal for any professional blogger should be to understand in a crystal clear manner the goals for content marketing. If the needs are not clear, writing even tons of article won’t help. You need to think clearly about the complete picture and plan each and everything associated with your content marketing strategy.

That can include making sure that your visual visitors get caught up by your email marketing strategy when they come to your site or the advertising you run or the backlinks or affiliate marketing techniques. You cannot make a mix of all marketing strategies in the end. Thus be clear about what you want to market.

2. Write kickass content.  

Your content’s quality should be precise, accurate and spam free. If you are writing on body building, don’t try to make it a comprehensive guide about all health related tips and tricks. If you want to learn how to become a professional blogger, first thing you should remember by heart is that you cannot compromise on content quality.

3. Personalize your web page for users.

Users should get a feeling they are back to a place they have visited. Thus if they get a popup of welcome back or feed based on their interests they will become more excited and happy. Thus personalization should be one aim that should always be included in a content marketing goal.

4. Start using analytics.

A top notch blogger would always advise you to use an analytics tool. There are many such tools available with cheap prices and multiple features. These tools can help you know a lot about the engagement activity of your readers and their information like age, demographic, locations and time they spent on your page.

There are many free analytic tools as well and some such tools like Google analytics have helped many amateur bloggers game up their level and become a pro. Based on the results and observations you can change and improve your content.

5. Offer freebies and benefits.

To build a huge user base you need to make sure your users receive benefits and freebies as they go along. These can be in form of free e-books or unique and helpful items which addresses the pain points of your readers.

6. Ask for feedback.

One goal you must have in mind when you are working on content marketing is asking for feedback from your readers. Asking for a feedback can be done instantly on website or through the emails. You can always try to build an email list and prepare list of follow up emails which will ask readers about how they feel and what else they are looking for from your blog.

Lastly, you need to keep revisiting your basics and improve and evolve as time and technology changes.

No comments
Jeremy Webb6 Essential Content Marketing Goals for Professional Bloggers
read more

What Is Disruption, Really? 8 Examples and What to Learn From Them

If you’ve read an article about a hot new app, or a tech-based service that’s taken off in the past few years, you’ve likely encountered it being described as “disruptive.” But after seeing this term thrown around for half the companies in Silicon Valley, and hearing it applied to concepts in your own business or organization, you might be skeptical about its value — or at least, its usage.

However, understanding “disruption” can help you get a better understanding about what true innovation is, and possibly, improve your own business to produce more innovative products and services.

The Origins of Disruption

“Disruptive innovation” is a term coined by Clayton Christensen, referring to a process in which an underrated product or service starts to become popular enough to replace, or displace, a conventional product or service. In “true” disruptive innovation, the product takes root in the bottom of a market — and in many cases, develops a bad or low-class reputation because of it. However, due to low costs, higher accessibility, or other advantages, the product eventually becomes more appealing than its contemporaries within the industry.

This is contrasted with “sustaining innovations,” the new inventions and modifications generated by incumbent businesses in an attempt to stay relevant with customers. These innovations can be valuable too, but in most cases, products and services developed along these lines become too sophisticated, too inaccessible, or too expensive to have any real lasting power. Accordingly, customers look to less expensive, sometimes radical alternatives to meet their needs.

The defining traits of disruptive innovators are lower gross margins, smaller target markets, and products and services that are often simpler than their contemporaries.

The problem with applying this term to any new business that challenges an industry is that it undermines what true disruption is. It tends to attract more attention to startups that are already getting attention, while the true disruptors are slowly climbing the ladder elsewhere, unnoticed by the industry giants they’re meant to replace.

“Real” Examples of Disruption

It’s perhaps easiest to understand disruption when we look at real-world examples of it in action:

  1. Netflix, streaming video, and OTT devices.
    Netflix — and other streaming services — are continuing to disrupt the entertainment industry. They’ve all but killed physical video rental stores, and are slowly allowing more and more customers to cut their cable subscriptions. OTT options like Hulu and Pluto TV emerged seemingly out of nowhere, as a low-cost alternative to conventional subscriptions, and when they caught on, customers couldn’t help but think about their media in a new way.
  2. King Price Insurance.
    Relatively new on the market, King Price Insurance emerged as an alternative to conventional car insurance plans. Unlike typical insurance policies, King Price Insurance offers insurers policies with gradually decreasing premiums, in line with the depreciation of your car’s value. The model takes more data into account than traditional insurance policies, and in line with disruptive innovation, targets a smaller market with lower gross profit margins to offer a superior service.
  3. Wikipedia. It’s a little ironic that you can read about disruptive innovation on Wikipedia, which is, in itself a disruptive innovator. Younger people won’t remember, but for centuries, encyclopedias were written and published for profit. You’d have to pay $1,000 or more for a few hundred pounds’ worth of hardcover volumes, and hope that it lasted more than a year or two of relevance before its important details were updated. Wikipedia is updated constantly, and is available for free, though it didn’t carry much trust at first. Still, Encyclopedia Britannica published its final volumes in 2012, after 244 years of circulation.
  4. LEDs.
    It’s hard to think that there was a time that LEDs were once considered impractical, but the first generation of LEDs were weak and unreliable, useful only as indicator lights. Cheap and available only for niche markets, LEDs eventually became more reliable, and soon became ridiculously more efficient than traditional incandescent light bulbs—in fact, they only use 20 percent of the electricity.
  5. Skype.
    You’ve probably used Skype before, and have been used to its existence for years, but think about how disruptive the service truly is; users all over the world can chat, call, and video chat with each other for free (or for very low fees). Originally targeting a small market of users, Skype has ballooned to have more than 74 million active users—and it’s entirely replaced mainstream forms of communication for some customers.

What Isn’t Disruption

We can also make the case for disruptive innovation cleaner when we highlight some examples of companies that aren’t disruptive:

  1. Uber.
    Uber is often cited as an example of disruption, but that descriptor doesn’t hold upon close examination. Now climbing north of a $72 billion valuation, Uber is undoubtedly a pinnacle of modern tech success. And on the surface, it has a few hallmarks of disruptive businesses; it did, after all, replace the taxi industry for many travelers throughout the U.S. and internationally, after a start as a small, scrappy company. But here’s where Uber isn’t disruptive; it didn’t open up a new market or capitalize on low gross margins. It just took the typical taxi service model, and upgraded it with tech to make it more convenient and a little less expensive. Accordingly, while both innovative and successful, Uber is not a disruptor.
  2. Google.
    Google has explored many areas of tech, and could be considered a disruptor in some of them, but for this article, let’s focus on Google’s emergence as the dominant search engine. Google was the first online company to prove the value of online search, and the first to make ridiculous amounts of money from online advertising—it did, therefore, help to spawn a new industry (if not several). But Google isn’t a disruptor because it wasn’t the first search engine—not by a long shot. All it did was take an existing model and make it better. This is an impressive feat, but again, doesn’t qualify as disruption.
  3. Tesla. Tesla is another company frequently described as a disruptor, in part because of the sexy vehicles in its lineup that are, admittedly, unlike anything else on the market. And while Tesla is known for ground-level innovations in everything from the design of its vehicles to its organizational structure, it can’t be considered a disruptor. Its vehicles are exactly that—vehicles—and while they rely on a unique power source, they don’t enable transportation in any truly market-changing way. Plus, even the cheapest models here started at $35,000, making it too overpriced to appeal to the low-level market.

Key Takeaways

Let’s see if we can reduce this information to a handful of key takeaways for entrepreneurs who want to know more about innovation—especially in its most disruptive forms.

  • Innovation doesn’t have to be disruptive.
    Recall that disruptive innovation is only one type of innovation—and you don’t have to be a “true” disruptor to make a difference in your industry. Google is a perfect example; Alphabet (Google’s parent company) is now one of the biggest and most important tech companies in the world, and it all started because Google’s founders could offer something a little better than what was currently on the market.
  • True disruption is a bit of a gamble.
    Even with a good idea in place, there’s no guarantee that a new technology or potentially disruptive idea will take hold. Some inventions require multiple phases of evolution before they reach their final form—and that means lots of inventions get lost in the shuffle before they get there, losing out to unsustainable practices, market shifts, or stagnation.
  • Disruption is oftentimes stealthy.
    Understanding disruption isn’t just about creating better ideas; it’s also about being defensive, and looking out for new competition that might disrupt your industry in the future. If a startup is labeled “disruptive,” you might want to give it notice—but the biggest threats to your business are the ones you won’t see coming. Dig deep and take all threats seriously, even if they’re starting out with lower profit margins and a smaller target market than you’d expect from a legitimate competitor.
  • Disruption takes time. When Wikipedia launched in 2001, nobody would have predicted it would have the power to overthrow Encyclopedia Britannica; this was a feat that took more than 11 years to accomplish. Disruptors don’t change the market after a month of being publicly available; it takes years, and sometimes decades, to take hold.

    With a better understanding of disruption, you’ll not only find it easier to wade through the buzzword-laden articles hyping up the latest startups to emerge from Silicon Valley, you’ll also be poised to find faster, more sustainable forms of innovation in your own business.

    You may not be in the market to create the next LED, or change the world with an invention on par with the transistor radio.

    ​However, you can, at a minimum, guard yourself against future industry disruptors and possibly come up with more competitive solutions to keep your business thriving.

No comments
Jeremy WebbWhat Is Disruption, Really? 8 Examples and What to Learn From Them
read more

Outsourcing Core Functions: What Businesses Should Do?

Businesses are giant machines that run because of small cogs — and those cogs are processes.

Simply put, businesses are only as effective as the combined effectiveness of their individual processes.

Most business leaders believe that BPOs and IT are the only two ways to understand the outsourcing ecosystem. This belief is seen in the generic statistic that 64.3 percent of all global outsourcing comes under the umbrella of IT; whereas 24.6 percent comes under business processes.

Outsourcing is bigger than just BPOs and IT functions. In order to make outsourcing a more effective process, those undertaken by a business should be bifurcated into core functions and non-functions.

Many generic categorizations would have marketing, finance, accounting, and manufacturing together as the core functions of a business that cannot be outsourced. The rationale for this is that these functions carry sensitive information that cannot be disclosed to anyone except the business’ top management.

A simple way to protect this information is by using a Non-Disclosure Agreement and encrypting sensitive data. There is no need to keep something in-house to protect the data, especially if the business cannot handle it efficiently.

Therefore, in order to see whether certain things should be outsourced or not, business leaders should focus on the very definition of core functions.

A core function is a business process that:

1. Can give the business a significant edge over the competition, if it becomes the business’ long term competency.

The focus here is on getting a significant edge over the competition, not an incremental one. Financial analysts call this a ‘moat,’ which cannot be replicated by the competition. A moat refers to a defensive barrier built around a castle to stop enemies from entering.

Thus, for a business function to be called a core function, it should give a huge edge to the business and not be replicable.

2. Has a direct impact on the current and future performance of the business:

The function should have a significant impact on the overall performance of the business, both in the long and short term. If the function is crucial in the long run, it becomes a strategically important function. Such a function should be taken in-house, even if it that incurs higher costs. 

The higher cost is because an important long-term function should be able be properly executed by the business itself. Initially, there may be high costs as a result of running it internally, but over time, the business’ learning curve will cause costs to decrease.

An example of this is the tech giants Facebook and Amazon. Initially, both businesses were dependent on external service providers for web hosting. As time went on, they brought their hosting needs in-house and now their server storage spaces are so huge that both Facebook and Amazon have an alternative source of income from renting those spaces.

3. If not taken care of, can have a domino effect on all the other business processes:

This criterion is based on the importance of a business function as per its interdependency on other business functions. If the success of the function has a direct correlation with the success of other functions, it becomes a core function.

Anything that does not satisfy all three of these criteria is a non-core function and can be readily outsourced. In fact, it should be outsourced.

This might sound radical to many businesses, but the rationale for such bifurcation is to make it leaner and more efficient.

This categorization goes against the popular belief that certain functions have to be handled in-house because that is how it was always done. For instance:

a. Manufacturing is said to be a core function for a business.

The motivation to keep manufacturing in-house is that it handles quality levels. Contrary to this belief, Apple, one of the best electronic brands around, outsources the majority of its manufacturing. Apple clearly gains a huge advantage by doing so — their costs are lowered because the process is executed by someone who specializes in it. At the same time, Apple can focus on its own core functions, like designing and marketing products.

b. Similarly, it is said that marketing should be done in-house because it shapes the brand.

Unilever and P&G, two of the largest consumer brand houses today, outsource most of their marketing communications to creative agencies who are entirely focused on this. By outsourcing marketing, these businesses can get effective results, and can devote themselves to their core functions, like product planning and brand management.

d. Accounting is the language of the business, but it is not necessary for all businesses to pay for a full-fledged accounting team from day one.

Last week, I was talking with Tim Chavas from Zipbooks, and he said, “Publicly-listed companies are legally obliged to have an in-house accounts team handling all the primary paperwork.

Additionally, all the companies are supposed to get their books of accounts authorized by the public accountants as well.” That being said, many companies offer services like handling the majority of the accounting needs of small businesses.

For instance, the big four of accounting – PWC, Deloitte, KPMG and EY – started their services as tax consultants and external accountants. There are many smaller firms that can act as outsourced accountants. Additionally, with an automated billing process, outsourcing becomes a simple data transaction.

c. Start-ups, in their initial stages, do not need CFOs. 

Most of the work relating to finances is so small that it only requires attention occasionally throughout the year. Therefore, many successful start-ups hire CFOs on a contract or project basis. This is one way of outsourcing the finance function so that the start-up can conserve resources that it would’ve otherwise spent while searching for and hiring a full-time, in-house CFO.

At the end of the day, businesses resort to outsourcing for these top four reasons:

a. Cost cutting.

b. To be able to focus on core competencies.

c. To solve capacity issues.

d. To enhance service quality.

When the business keeps its core functions, as defined earlier, in-house; they automatically take care of these four goals in the long run. Businesses should focus on understanding strategy and defining core functions, so they know which functions can be outsourced and which cannot.

No comments
Jeremy WebbOutsourcing Core Functions: What Businesses Should Do?
read more

10 Factors to Consider When Planning Your Website

Are you among those who are just starting up or thinking that 2018 is the year to take your business online? Either case, there are plenty of things to consider before launching your brand new corporate website. Joe Balestrino, Founder of 4pointdigital, takes you through 10 essentials to mull over as you start to get the wheels in motion.

1. What level of service do you want for your website?

Internet service providers ISPs (i.e. broadband providers) are companies that’ll give you a connection to the internet for a fee. Every internet user in the world accesses the web via an ISP. ISPs such as Virgin Media, Talk, BT, and Sky will all offer different levels of management, security and broadband speeds, so it’s best to do some in-depth research before parting with your money.

2. How much hosting space are you going to need?

A useful analogy to help explain what web hosting providers (WHPs) do is to think of them as the landlord you rent your office space from, but online. Without using hosting services you won’t have a place to house the files that live on your website.

It’s important to remember that other hosting services, like email, require additional storage so double-check that the space offered by your ISP will be enough, or whether you’ll need to arrange more from a WHP.

3. What will you name your website?

Selecting and securing the right domain name for your website is crucial and choosing your business name is definitely the best way to go. Taking this approach gives your website legitimacy, makes customers feel it’s a site they can trust and helps people to find you easily.

Moving quickly is essential too as domain names get snapped up fast. For more useful advice when deciding on your domain name, go through this Godaddy post.

4. What’s your website going to be for?

Whether you’re wanting to build your brand, sell goods or services, or expand your business, establishing the main purpose of your website is the perfect way to help you to decide how best to design and brand it.

The Singaporean brand, Smile Tutor that deals in home tuition segment, knows exactly how to keep a play with website for audience retention, conversion, and to build trust. They do have animated services explainer video, testimonials, CTA buttons (to help the audience), and informational module, everything in place.

5. How will you decide on the look of your website?

Think about your target audience when deciding this and remember: simple layout and easy navigation work best online. Try to steer clear of over-complicating things in order to avoid confusing your users. It’s also worth bearing in mind that you can either pay a designer to create your website or use free tools available on platforms such as WordPress and Blogger to do it yourself. Once you’ve got the finished article, simply transfer it to your domain and chosen host.

6. Will social media play a big part in your online presence?

Channels like Facebook and Twitter are great for driving traffic to your website, but remember you don’t need to be on every platform possible. It’s essential to choose ones that suit your audience, so researching your target market is a good way to inform your decision. Then you can think about launching official pages for your company and how you intend to use them. To pick up more great tips about winning at social media, read this article from The Website Group.

7. Is being mobile-friendly important?

Given the current online climate, the answer to this is likely to be ‘yes’, especially as it’s predicted that the number of mobile users will soon overtake those using desktops. With more and more people using tablets and smartphones to view and buy from websites, it’s worth making sure yours is responsive and ensuring it can be easily navigated on these sorts of smaller devices.

Back in April 2015, Google has officially released its mobile-friendly ranking algorithm that was brought to give a remarkable boost to mobile-friendly pages in Google’s mobile search result. You can test your web page’s mobile-friendliness here – https://www.google.com/webmasters/tools/mobile-friendly/

8. Have you thought about legality?

Visiting websites like yours that provide the same service as you or sell similar products is a great way to help you decide on what your own policies should be. For example, how you’ll use and store the data submitted by your customers. It’s also incredibly important to display your policies clearly and in an area of your website that customers can easily access.

9. What level of security do you need?

You wouldn’t leave your shop unlocked or the door to your office building wide open, so it’s vital to apply this same mentality to your website. Ensure you install security software and be sure to download all the latest updates. Having a back-up system in place is also crucial. Leaving your website vulnerable to viruses or hackers could lead to losing your entire website and its data, which could devastate your business.

10. How will you track your online success?

It’s incredibly important to know where you’re winning and losing online so you can adjust your strategy accordingly. Luckily there are plenty of online tools, such as Google Analytics, which can help with this by offering straightforward ways to measure key performance stats i.e. page view, bounce rate and a number of visitors, etc.

Conclusion:

Given these initial 10 aspects of planning a branded new website, it’s obvious that there are many other things to come across when actually designing and developing it. You’ve clear goals to increase online traffic (through search, social, email marketing, and other mediums). 

Have you set goals for generating leads for your business? How will your site’s design, navigational structure, and web page copies play an emerging role in engaging customers?  Do you have plans for leading further interaction with your Sales team? I’ll come closer to these related topics in my upcoming posts at Startup Grind. Stay tuned!

Feature Image Credit: https://www.pexels.com/@burst

No comments
Jeremy Webb10 Factors to Consider When Planning Your Website
read more

6 Ways to Upgrade Your Business Technology

It’s never been easier to access affordable technology while building a business. But at the same time, it feels like any piece of technology you buy becomes obsolete the second you pay for it. If you’re trying to strengthen your business’s revenue, it’s important to invest your dollars wisely, which means not paying for things you don’t need.

When it comes to tech, though, some things pay off more than others.

Here are six things to put in your budget if you hope to upgrade your technology.

Modernize your website.

As the customer-facing side of your business, your website speaks volumes on your behalf. For that reason, your first priority should be keeping it modern-looking. Even if your site is mobile optimized, you still may be scaring customers away if your design is outdated.

Pay close attention to trends in website design from one year to the next. You can also use a DIY tool like SquareSpace or Weebly, which gives you access to templates that feature the current trends in design.

Simplify.

If you’re working with a potpourri of applications for your small business, you aren’t alone. In fact, many businesses end up assembling a suite of solutions to accomplish their day-to-day goals. But at a certain point, businesses will want to find a way to streamline everything. The sooner you can do that, the better. From the start, try to choose applications that manage multiple tasks through one dashboard, then add on apps that integrate with those solutions.

Update your operating system.

Today, it’s slightly easier to keep your operating system updated on each of your devices. Both Microsoft and Apple push O/S updates to end user devices, as long as they have a machine that can handle the software. Make a point to regularly check each of your devices, including smartphones and tablets, to make sure you’re running the latest version of the operating system.

Even missing a few updates can leave your equipment vulnerable to an attack which, inevitably, puts your entire network at risk. By keeping your software as up-to-date as possible, you may be able to stave off a devastating data breach.

Fax to email.

Yes, you likely occasionally need a fax machine. It may be rarer than in previous decades, but when the request comes through to use a fax — you need to be prepared. Fax-to-email solutions let you receive and send faxes without a dedicated machine taking up valuable space in your office. Not only does this free up space in your own office, but it also lets you send and receive faxes wherever you are.

No more making a special trip to the office to send a fax. You can simply upload a file from your computer and send it, whether you’re working from home or waiting at the airport for your flight.

Lease your copiers.

Instead of buying printers, scanners, and copiers, many businesses opt for all-in-one units. Unfortunately, these can be costly and they quickly become outdated. You can lease an all-in-one and opt to get a new unit every couple of years.

This will keep your biggest piece of office equipment current without having to go shopping every couple of years. This will likely work best once you have multiple employees, though, since you can get an all-in-one desktop printer much more affordably than a corporate-quality copier.

Look into a wireless mesh network.

If your business runs on wireless, you may experience dead spots in certain areas of your office. A wireless mesh network is a way to overcome those issues, giving you more reliable Wi-Fi access at faster speeds than you may get with regular providers. Conduct thorough research into whether this is a better alternative for your own business and call around for the best prices.

You may find that the cost and reliability are better than what you’re already getting. This solution works best for companies that plan to run solely on wireless, rather than relying on a hardwired network.

If you’re interested in improving the tech in your business, there are small things you can do to stay up to date. It’s important to regularly audit your environment and find areas where you might be falling behind. By doing that, you’ll be able to remain competitive and keep both your customers and employees happy.

No comments
Jeremy Webb6 Ways to Upgrade Your Business Technology
read more

Leveraging Mental Models in UX Design

This post was written by Scott Benson, Designer for Toptal.

 

Whether it’s innovating a new product or optimizing an existing one, UX and UI designers should leverage their product users’ knowledge of familiar products and interfaces. The payoff is smoother interactions, faster adoption rates, and better overall usability.

Users know how your product works and how to use it even before you design it. At least, they should. Designers want to be exciting and original, but users will always approach new products and features based on what they’ve used before (it’s called a “mental model”) and for this reason, designers should work with user expectations.

Mental model definition

Through repeated use, users form mental models of how apps and devices should work.

What Is a Mental Model?

“A mental model is based on belief, not facts: that is, it’s a model of what users know (or think they know) about a system such as your website.” – Nielsen Norman Group

Through the habitual use of the multitude of products that exist today, a user’s brain develops mental models for how products function. These mental models are formed through the regular use of a system (such as a website, app, or even a more tactile user interface as in the car seat example above), and knowledge of how a system works.

Users will transfer expectations they have built around one familiar product to another that appears similar.

These days, it’s not uncommon to see small children who have likely spent more time interacting with touchscreen devices than books or regular televisions try to swipe flat screen TVs (or even books), and being surprised when swiping doesn’t work. Based on their exposure to touchscreen devices, the touchscreen generation have built up the expectation (the mental model) that swiping is how every box-like object should respond.

Even if they are confused by a book, these children probably have no trouble picking up an unfamiliar touchscreen device. This isn’t because they’ve spent time learning to use every individual device but because they got to know a particular one and how it works. Their brain stored a mental model for an operation, and they’re able to successfully apply that to other devices utilizing the same or similar patterns and sequences.

“Individual users each have their own mental models, and different users may construct different models of the same user interface. Further, one of usability’s big dilemmas is the common gap between the designers’ and users’ mental models.” – Jakob Nielsen, Nielsen Norman Group.

A UI that references the mental model definition of a seat

The car seat setting in a Mercedes is a great example of an interaction design that uses a mental model. A car seat shape for controls makes it intuitively easy to understand and operate.

Designers are immersed in design projects and regularly form mental models of their own. They also acquire them from common interaction design patterns utilized by other designers. In a way, this can create a “designer bubble.” It’s easy to fall into the trap of designing something that makes sense to other designers, but which nevertheless may confuse the average user.

People have unique mental models generally formed by education, experience, age, and culture. The average user is not as well-versed in the subtle UI patterns familiar to designers living in the aforementioned “designer bubble.” In order to empathize with users and design for maximum usability, designers need to shrink the gap that exists between the designer and user mental models.

In order to align with users’ existing mental models, the design process should incorporate an understanding of users’ expectations around the way a product is going to work. This is especially important as part of UX research methods used to uncover user needs and pain points.

Misaligned User Mental Models

Misalignment of mental models occurs when there is a discrepancy between a user’s mental model and how a design actually works. This kind of disconnect creates usability problems, as the product doesn’t align with the user’s expectations and existing knowledge. The window for capturing a user’s attention and confidence is small, so misalignment can spell disaster.

For example, most people have used enough eCommerce systems that they have developed expectations for how the experience flows. Surprising users with an unexpected flow could potentially mean a drop in conversions and sales.

Today, most shoppers have an expectation of optional registration based on previous experiences and prefer not to spend their time filling out forms but check out as a guest. According to a survey by Econsultancy, 25% of shoppers abandon their purchases when forced to create an account before going through the checkout process.

In a case study by User Interface Engineering, when a “Register” button was replaced with a “Continue” button in a checkout flow, that minor adjustment created a $300 million boost in revenue. Based on previous experiences, shoppers had a mental model of the process that would follow after clicking the “Register” button—typically a time-consuming registration process that would be necessary before purchasing the product. These negative expectations caused shoppers to abandon their cart.

In another example, Snapchat recently got significant pushback after making major changes to their UI. Users wanted Snapchat to look and operate like the previous version to which they’d grown accustomed, and existing mental models didn’t align with the new release.

The result? Users were confused, made to feel inept, and the change led to a mass exodus from which the company may not recover.

To recap—people have expectations and mental models that are based on previous experiences using a specific product. Unexpected surprises in the UX or UI can lead to confusion and frustration and companies pay the price.

Misaligned mental model

Mental models mismatch in action: The recently redesigned Skype UI confuses users and slows them down due to its use of non-standard dialogs where options don’t look like dialog buttons.

Improving Misaligned Mental Models

Usability testing and other UX research methods help reveal discordance between the designed experience and users’ mental models. Furthermore, gaps between mental models can be improved with interactive tours, careful onboarding, real-time feedback, and/or signifiers to assist in learning new product features and a new UI.

Updates and design changes don’t have to cause chaos for users. Instead of forcing a change, it’s advantageous to give users the opportunity to to update software when they are ready. When a user is able to consciously choose when an interface may change and potentially challenge their existing model of a familiar product, they are more aware of as well as empowered by the new design.

Google Calendar redesign adjusting users' mental models

Google made sweeping changes to the UI and behavior of Google Calendar, a product which had not changed much in many years. By warning and allowing them to opt in over several months, Google empowered its users to decide when to change their mental models of how the product should work.

Google recently overhauled their Google Calendar. The redesign brings some of the most significant design changes in a decade to a product used by millions worldwide. Rather than foisting it upon its users, for whom a drastic change in something so essential could add friction and frustration, they alerted users to the imminent changes. Google allowed users to switch between the old version and the update for several months before finally replacing the old version completely.

Making older versions of a product compatible and available, and allowing users to continue using a familiar version for a limited time, can maintain trust. Allowing and empowering users to decide when to learn the new interface will help them feel as if they’re still in control of the experience.

Mental model UX for user onboarding

Slack uses interactive tours to help new users learn the interface and efficiently improves any contradictory mental models users may have.

Making sweeping, large-scale changes to existing designs that users have become familiar with could violate users’ existing mental models. To minimize the risk of upsetting users, companies may consider letting out minor adjustments through several updates or testing changes with smaller groups.

Facebook has been quite successful in its use of this strategy. “Reactions,” for example, were implemented and tested extensively in specific territories before they were released worldwide. Although minor adjustments happen frequently, Facebook is careful about rolling out major updates that can disrupt users’ mental models. Launching changes through multiple releases can minimize the number of mental models that need to be improved.

Designing on a Foundation of Mental Models

Jakob’s Law of the Internet User Experience states that “users spend most of their time on websites other than yours. Thus, a big part of customers’ mental models of your site will be influenced by information gleaned from other sites.”

Simply put, the goal of UX designers is to create a process that allows users to accomplish their goals quickly and easily. People are creatures of habit, and leveraging user mental models means that users will know how to use a product before they’ve ever used it.

Mental Model Research

It’s common for UX designers to create journey maps and empathy maps, and to use data to help identify user pain points when creating a new product (or improving one). When it comes to mental models, the same UX research methods and processes can be applied to the study of existing competitor or peer products.

When designing a new product, studying an existing system can potentially save designers a lot of time and money since it can eliminate the need to create new prototypes from scratch in order to test new concepts. Watch how users interact with existing designs to find out what they may expect from something similar.

Designers can attempt to improve on solutions that already exist. Additionally, as long as the target demographic is the same, mirroring well-known systems means that little testing has to be done to verify the usability of core functionalities.

Studying systems and mental models

Users of competing and/or related systems can be studied to find out how they are working currently, their current mental models, and what their pain points are.

Mirroring Existing UX

The world’s most popular apps are directly influenced by one another, and they regularly implement designs based on existing mental models. For example, Facebook introduced the interaction pattern of “Likes,” which were then copied by LinkedIn and Instagram.

Twitter introduced hashtags, which were then copied by Facebook and Instagram. Tagging was introduced by Twitter and then copied by Facebook, LinkedIn, Instagram, and others. Instagram introduced stories, and then Facebook implemented those. Snapchat introduced photo filters and manipulation, and then Facebook copied those.

In almost all of these instances, there is very little variation in the adoption of these features. Facebook and Twitter are very competitive, and they’re always looking to capitalize on each other’s success. Facebook is methodical at mirroring a competitor’s product experience, and when a new, successful app emerges, if they’re unable to acquire it, that is exactly what they will do.

Social media UI leveraging mental model UX methodology

Facebook Messenger’s UI mirrors Snapchat, capitalizing on existing mental models. Users of one popular app will have no trouble using and enjoying the other.

Recent statistics show that Facebook has over 2.2 billion monthly active users. The application is so popular that it has influenced many designs today because users have expectations around the paradigms that familiar products like Facebook have established.

For example, due to Facebook’s design influence today, it’s pretty standard to find the notification icon in the top right corner near the login area on many different desktop applications. Status updates, news feeds, and likes are also increasingly common patterns in other applications.

LinkedIn could have designed personal updates, news feeds, or notifications any way they wanted. However, capitalizing on their success, large user base, and users’ existing mental models, they chose to create an experience that directly mirrors Facebook.

Unless there is a specific reason to circumvent what the user has come to expect, referencing familiar patterns allows the designer to focus users on more important, unique features of the product. Even if someone has never used LinkedIn, their knowledge of Facebook will mean that everything is familiar.

Mental Models and Skeuomorphism

Skeuomorphism is a term that is used to describe interface objects that mirror real-world counterparts in how they appear and/or how the user can interact with them. This design concept capitalizes on users’ existing knowledge and mental models of an actual object so they don’t need to learn a new interface.

Many digital UI elements reflect real-world counterparts. This isn’t because designers lack imagination, but they realize a UI element detached from any analogs in the physical world means more effort on the user’s part in order to interpret what they are seeing. Incorporating a switch in a digital UI that looks and acts like a light switch that someone may find in their home dramatically cuts the cognitive load for that user. The visual metaphor is there, and they immediately know what it’s for.

Good UX methodology leveraging mental model UX

Even completely abstracted, the average user will likely know that what they are looking at is a set of switches to turn on and off as desired. Google’s Material Design system uses very flat visual design and iconography but leverages common UI patterns based on physical metaphors to ensure optimal usability.

This principle should be used in moderation, but can be quite effective for usability if applied properly. Skeuomorphism implies that the UI both looks and functions like its real-world counterpart. However, designers need to be careful with this mental model theory, as discrepancies in functionality or appearance can actually detract from a design’s usability.

Skeuomorphic design is common in professional audio production applications. Digital plugins often emulate analog gear, such as compressors, equalizers, and reverb units. In the image below, the digital plugin on the bottom left utilizes skeuomorphic design to emulate the top unit.

The use of skeuomorphic design elements enables users to apply mental models that exist from operating a real-world sound compressor. The image on the bottom right uses a unique design that isn’t based on any existing piece of gear. Because of this, even if they had used a real-world physical counterpart, users would have no foundational knowledge of the interface and would need to spend additional time and effort to learn it.

Skeuomorphic designs reference real-world types of mental models.

Digital audio plugins often emulate analog gear, such as compressors, equalizers, and reverb units. Utilizing skeuomorphic design capitalizes on existing mental models. The bottom left plugin uses skeuomorphic design, while the bottom right plugin does not.

Foundational Creativity and Innovation

In order to maximize usability, it’s important to design on a foundation of mental models. Creating and innovating within existing mental models and standards can bring about new and exciting products that still align with user expectations. Violating those mental models should be done strategically and only when necessary.

For example, most people have developed a mental model of volume sliders. In the example below, the slider on the left represents the mental model that most people would have for a volume slider. The middle slider was designed as a joke, but it illustrates an important point.

The slider completely contradicts mental models and user expectations, as it appears like a vertical slider, but instead, it operates horizontally. The slider on the right is taken from Apple’s iOS. Apple used creativity and innovation to design something new and original, but it still respects the latticework of mental models that forms the shared expectation of how a volume slider operates.

Contradicting common mental models' mindsets

From left to right: Volume slider representing the common mental model, volume slider contradicting the common mental model, and volume slider from Apple’s iOS, utilizing the common mental model in a new design

Final Thoughts

Conducting UX research on established designs will help clarify existing mental models and enable designers to leverage those of their product users’. The findings, in turn, will help designers optimize the usability of any digital product.

Designers who ignore mental models do so at their peril. Leveraging existing mental models as a foundation for creativity and innovation could enable designers to improve existing products as well as help them design exciting new ones.

No comments
Michelle YoungLeveraging Mental Models in UX Design
read more

How To Find Fulfillment Outside a Paycheck

When you pass away, what will you be remembered for? Will it be because you made a difference or because you made a living?

You have a chance to make a different choice for yourself.

Many people get so caught up in the professional rat race that they end up with a lost sense of purpose and misplaced priorities. 

In carving a career path for yourself, you must bear in mind that your chosen career path will be a means to an end. You want the end of it all to mean something more than just paying the bills and having food on the table.

Of course, the bills should be paid and you shouldn’t starve — but choosing a career path to earn a paycheck for just these purposes is limiting — very limiting.

You should choose a career that gives you a great sense of fulfillment.

How do you go about this?

Any career that doesn’t help you express what you’re passionate about is a no-no for you. Unfortunately, in most cases, no one tells you about this.

So, after going through school, bagging a fancy degree, and getting a good-paying job, you still have a deep feeling of dissatisfaction.

What do you do at this point? First, let’s explore the problem, then find a solution.

The Paycheck Dilemma.

We’ve been pressured by society to chase “lucrative careers” at the expense of genuine passion.

For some of us, we had no say in choosing our career. We only had to grow into a pre-chosen career as a child’s feet grows into an oversized shoe.

Yet, the irony is we only get good jobs done and have a greater chance at demanding higher fees when we feel passionate about the jobs we do.

Your chosen career should not stifle you. You’re a bundle of powerful creative fireworks waiting to detonate. You’ll end up frustrated if you’re not permitted to get into your zone where you comfortably ‘explode’.

Why People Make Wrong Career Choices.

Working and finding fulfillment is many people’s wish but, sadly, not their reality. You may end up in the wrong career and have to settle for less because of the interplay of several factors.

1. The Money Factor: This is usually the strongest factor that navigates people into wrong career paths.

If you’ve been influenced by the prospect of a fat check, it’s really not your fault. In times of economic downturn, you may be compelled to make the available the desirable.

When you have a boatload of bills, the last thing on your mind is searching for a job that gives you ‘fulfilment’ or ‘happiness’. As long as your bills are paid, who cares?

So you stick with a job you hate, stick with an overbearing boss, and stick with unfavorable working conditions because the job pays the bills.

2. Societal Pressure: This is yet another reason you may end up with a job you hate.

You may have folks practicing a profession, who want you to tow their path without giving a moment to consider what you’re truly interested in.

In a society that glorifies professional careers over others, the societal factor kicks harder felt, especially when you’re passionate about an unprofessional career.

When you bow to societal pressure, you ignore your true passion to meet society’s demands. And when things turn awry (as they often do when you’re stuck with a distasteful job), society spits in your face and blames you for listening to her.

3. Environmental Support: You may live in an environment that is hostile to your career and may not have the much-needed support to get the education or job you want. So, you’re forced to settle for the crumbs that fall off the table.

It may be very difficult to leave the little you have to pursue what you want, because of the uncertainty of the future. However, someday you may have to summon enough courage to test the deep waters if you really want fulfillment outside a paycheck.

These challenges to a right career choice are legitimate, but not insurmountable. Examples abound of people who have overcome similar challenges. Of course, their experiences and conditions may differ significantly from yours, but you may still learn one or two things from them.

What Should You Do?

Whatever action you’ll take significantly depends on your current position and future prospects.

For instance, if you’re working at an eight to five job you don’t like, but pays the bills, you may start a side gig on what you’re passionate about while keeping your job.

If you’re able to grow your side gig to a financially stable business, you may safely make the cross from an eight to five employee to an entrepreneur.

One thing to watch out for is the mental trap of not chasing your passion until you make enough money at your current job. Most times, you never get to the point where you’ve made enough money to quit your job.

On the other hand, if you’re working at a job you enjoy but isn’t paying the bills as much as you’ll like, you may try to seek other opportunities in your industry where a greater demand and value will be placed on your skills.

In addition, you may also consider how much value you’re bringing to the table compared with your colleagues who earn more and then step up to the challenge by increasing your knowledge base and sharpening your relevant skills.

Before you sentence yourself to a career you don’t enjoy to pay the bills, create a career plan that’ll excite you, diligently hone your craft over time and steadily increase your value.

As Sir Richard Branson said, “There is no greater thing you can do with your life and your work than follow your passions — in a way that serves the world and you.”

Don’t chase a fat paycheck alone, my friend. Do the type of work that gives you a great sense of fulfillment and satisfaction — and find a fatter paycheck in it.

No comments
Jeremy WebbHow To Find Fulfillment Outside a Paycheck
read more

Make Yourself Useless in Your Company

“The growth and development of people is the highest calling of leadership.” — Harvey S. Firestone, founder of Firestone Tire & Rubber Company

To have any chance at greatness, leaders must have high-performing, low-maintenance teams.

At a very practical level, it’s your job to help the amazing people you’ve hired become great leaders.

Do not view them as underlings or boots on the ground. See them for their talent and potential. Let them live up to their ability to deliver amazing results with little (or no) involvement from you.

Build a team that delivers better results than you, without you.

To do this, you need to invest time hiring, teaching, coaching, challenging and providing feedback. When you help people grow, they gain the confidence and skills to manage day-to-day business without you.

For you, this spells freedom. You’ll be able to spend your time on your company’s big picture strategy and long-term growth. 

It’s remarkable how often leaders get trapped hand holding mediocre players.

Sometimes it’s because they hate hiring, so they’d rather live with the devils they know. Others let personal loyalty cloud better judgment.

No matter the reasoning, you’ll be forever limited unless you do what it takes to surround yourself with A-players who are truly exceptional in their fields, and a culture fit with your company.

People think “A-players” are four-leaf clovers, but that’s not my experience.

You just need elbow grease, and a proven hiring methodology to find the best of the best. Then it’s your job to keep challenging them, and investing in their growth.

Believe you can have a full team of A-players. Then accept nothing less.

Pick your useless date.

Choose the exact date you plan to be completely useless to your business. This is the day you will be free to step out of the day-to-day operations, or sell the company entirely. Envision yourself walking out the door.

It’s crucial to pick a specific date so you can clearly see yourself moving on. Without it, you’ll remain enmeshed in the business. You won’t push yourself to build a solid, self-sustaining team.

Whether you actually leave is not the point. The point is to build a company so strong it would function effortlessly without you.

Here’s a simple performance rating system to help you get clear on where you are today:

A-player: fits the culture, and always delivers exceptional results with little or no management. An absolute pleasure to work with, and you wish you could clone them.

Potential A-player: appears to be an A, but has been in the role less than six months. Looks promising but it’s too early to be 100 percent sure.

Toxic A-player: excellent performance, but regularly causes friction and drama as they don’t fit the culture.

B-player: a culture fit with spotty performance. 

C-player: doesn’t fit the culture or deliver results.

My website is filled with extensive tools and exercises for evaluating your team.

Visit www.lawrenceandco.com.

A to stay.

Follow the motto: “You have to be A to stay” in your company. This is neither impossible nor ruthless. It’s just common sense.

A-players are your greatest assets. They produce more results than two or three B-players, so invest what it takes to find and keep them.

Don’t fall into the habit of neglecting them because they are so self-sufficient. It’s vital to have your pulse on how they are doing at all times because:

A-players have two dangerous tendencies: boredom and overwhelm.

They will be bored to tears if you don’t let them handle increasingly difficult challenges. That’s why a favorite question for A-players is, “Are you challenged enough? Too much?”

Having said this, most A-players will not cry uncle when they’ve exceeded their limit. If you push them to the point of overwhelm, they may cut and run.

The key is to strike a delicate balance. Keep them challenged. Make sure it’s sustainable.

Help your “B-players” become “A-players.”

While the majority of your effort should be spent hiring and grooming A-players, your B-players deserve the chance to move up the roster. they are a cultural fit and that’s a significant starting point.

Often B-players just need development, confidence boosting, or a tweak to their role so it’s more in their sweet spot. You may convert them to an A through coaching, mentoring and/or training.
Whatever you do, don’t set them up for mediocrity by forcing them into a sour spot. No one will benefit.

The key to transforming your B’s to A’s is to help them see their gifts, and accept their weaknesses. Just because someone wants to be in a management role doesn’t mean they should be. If their true gifts are as a technician or individual contributor, that’s the only way they will ever be an A-player.

It’s your job to identify how people can thrive, and guide them to be their personal best.

Manage out the “C’s.”

People often get messed up by putting too much energy into C-players, diligently trying to help them improve. That’s what you call throwing good money after bad. Do not be soft with your C’s.
Even if they somehow manage to improve their performance, you’ll never force them to be a cultural fit.

Give them a fair shot, of course. Make sure you’ve clearly communicated the culture of the company, and the expectations of their role. If they still can’t measure up, set them free so they can find a place where they are naturally an A-player.

Be ruthless about hiring.

Most hiring is way too casual, amounting to chit chat and a wild leap of faith. You probably wouldn’t get married after some pleasant banter over cappuccino. Don’t hire people this way either.

Too many hiring decisions are made on great first impressions, but this has little correlation to actual skill and talent.

If your hiring process is deep, methodical and unsentimental, your chances of landing A-players skyrocket. You know how deeply you know someone after you’ve taken a long trip together? Yeah, that’s how well you should know your candidates.

Seem impossible? Not at all. That’s the level of familiarity you get with a super-thorough, ruthless hiring methodology. Don’t let your HR people resist you on this. They may dismiss the idea of using a methodology at first because it’s unfamiliar. But the proof is in the pudding.

My final word of advice: before you draft that offer letter, put your candidates to work.

If someone says they are an expert in conflict resolution, bridge design, blog writing or programming, let them prove it to you. This simple and obvious step in hiring is often missed. Seeing people in action is a sure way to separate the talkers from the doers.

So yes, hiring A-players takes time and scrutiny. But it’s far less painful than hiring mediocre people and cleaning up the mess later.

No comments
Jeremy WebbMake Yourself Useless in Your Company
read more