Originally published on April 6, 2017

Image for post
Image for post

28th in a series of 50 Knowledge Management Components (Slide 38 in KM 102)

User interface: the point of entry to a knowledge base that provides navigation, search, communication, help, news, site index, site map, and links to all tools

To make it easy for users to access the people, process, and technology components offered by your KM program, provide an intranet or portal site with obvious links to the available resources. Allow users to quickly navigate to the appropriate sites based on their role, business process stage, and current requirements.

The principles of good usability should be incorporated into the user interface. Here are some specific suggestions for doing so.

  1. Keep the size of the home page to a single page without the need for horizontal or vertical scrolling. The page should load quickly, be visually appealing, and be as simple as possible.
  2. Provide direct links to the most important sites so that multiple clicks through intermediate sites are unnecessary. Don’t make users visit multiple sites to get to the one they need.
  3. Remove all static information such as mission statements so that only dynamic news and useful links appear. Emphasize practical over political content.
  4. Avoid overwhelming users with long menus of links which appear on the page. Provide nested drop-down menus in a horizontal navigation bar which is replicated on each page within the site.
  5. On each page within the site, include standard elements in the same location. These include standard banners, footers, and navigation bars. The banner should include a search box, a people lookup box, and one or two other essential links and boxes that are used so frequently that they belong in the banner. The footer should include the date last modified, the page owner, and links for feedback and support. Standard navigation elements include a horizontal navigation bar with drop-down menus and bread crumbs which show where you are in the web hierarchy and allow direct navigation to any higher level in the hierarchy.
  6. Offer faceted navigation, browsing, and searching to guide users based on the standard taxonomy. See Use of Faceted Classification by Heidi Adkisson and User Interface Implementations of Faceted Browsing by Mike Padilla for more information.
  7. Use a site map to show the overall web structure and all available pages in a single view. See Site Map Usability by Jakob Nielsen for design tips.
  8. Provide an index to allow users to look up any desired topic alphabetically. Include synonyms as in a thesaurus so that regardless of which term a user chooses, they will be guided to the right place. For example, under the B section, you might include “Bulletin Boards — see Threaded Discussions.”
  9. Create a unique icon for each resource, and use it to brand the associated site. Keep all of these icons in a table, and every day, feature one of them on the home age with a link to the associated site. This will serve as a reminder to users about the existence of resources, draw them in through the icon, and lead them to the site.
  10. Include links to the Top 10 most visited sites, most downloaded documents, and most searched-for content. These can be updated automatically or through a monthly refresh process based on the web statistics in monthly usage reports.
  11. Provide a portion of the page to recognize people who demonstrate the desired knowledge-sharing behaviors. This can be a listing of the top ten incentive point holders, pictures of active community members, or success stories of practitioners.
  12. Include a few news items, and provide links for subscribing to notifications, communications, blogs, podcasts, and videos. Keep the news fresh, and archive items regularly. Post links to the latest issues of relevant newsletters.
  13. Prominently feature links to training, documentation, help, and support. If you offer a knowledge help desk, design an attractive logo for it and feature that link on all pages.
  14. Include the latest key metrics, and links to more detailed reports. Compare actual results to targets to celebrate progress and remind users of goals still to be achieved.
  15. Create a Knowledge Map which includes the key resources with an icon for each, their descriptions, and links to each one. Map these resources to the different user roles, business process stages, and knowledge requirements. This should answer the question “where do I go if I play role X, am in stage Y, and have need Z.” For example, I am a software developer, I am testing software code, and I need a standard test suite. The Knowledge Map should allow users to quickly zero in on this set of conditions and link to the required knowledge component.

Categories for navigation

  1. Internal organizational structure — e.g., Finance, Human Resources
  2. Formal taxonomy: industry or internal — e.g., Global Industry Classification Standard, enterprise taxonomy
  3. Products and Services — e.g., Android, Strategy & Operations Consulting
  4. Topics — e.g., security, supply chain management
  5. Industries — e.g., electronics, pharmaceuticals
  6. Clients — e.g., GE, US Government
  7. Partners — e.g., Ford, Microsoft
  8. Locations — e.g., Latin America, Detroit
  9. Specialties and Roles — e.g., project management, information architect
  10. Demographics — e.g., new hires, retirees

User interfaces to offer

  • Navigation
  • Search
  • Facets
  • Related (since you downloaded X, try Y)
  • A-Z Index
  • Tags
  • Bookmarks
  • Sorted by:
  1. Most visited or downloaded
  2. Most liked
  3. Most reused — add a “I reused this document” or “I found this useful” button, similar to a “Like” button, but more specific, to all content, and encourage users to click on this button for content they were able to reuse
  4. Most tagged — allow content to be tagged with “recommended” or “good example” or “proven practice
  5. Most recent

Flexible interaction options to provide

  • Mobile — optimize for mobile devices
  • Voice — accept voice commands and offer results by audio
  • Accessibility — enable people with disabilities to perceive, understand, navigate, interact with, and contribute to websites

Related Specialties

  1. Information architecture: the structural design of shared information environments; a discipline and a set of methods that aim to identify and organize information in a purposeful and service-oriented way; the resulting document or documents that define the facets of a given information domain
  2. Usability: making products and systems easier to use, and matching them more closely to user needs and requirements
  3. User experience: a person’s perceptions and responses that result from the use or anticipated use of a product, system or service

Case Study — HP

1. Intranet Home Page — The HP Knowledge Network was initially offered as an intranet page, with numerous links organized into multiple sections. It was very thorough, but very dense:

Image for post
Image for post

2. A-Z Index — An alternative form of navigation provided the same links, in alphabetical order and with multiple synonyms:

Image for post
Image for post

3. Engagement Knowledge Map — When some users complained that the intranet page and the index did not provide the context for when and why the different resources should be used, a third site was created that embedded the links into the stages of the HP Customer Engagement Roadmap:

Image for post
Image for post
Image for post
Image for post

4. Simple Guide to KM: When the Engagement Knowledge Map was still thought to be too complicated, a simpler user interface was created in which the answers to 9 questions were only revealed one at a time based on moving the cursor over a single question:

Image for post
Image for post

5. Search Tips — To respond to the common complaint that search didn’t work, or was too hard to use, a page of tips was offered:

Image for post
Image for post

6. Integrated Search — To avoid forcing users to have to try searches multiple times using different search engines for different repositories, an integrated search page was created, allowing a single query to be automatically replicated with no additional effort:

Image for post
Image for post

Insights

1. UI vs. UX: What’s the difference between user interface and user experience? by Spencer Lanoue

At the most basic level, the user interface (UI) is the series of screens, pages, and visual elements — like buttons and icons — that you use to interact with a device.

User experience (UX), on the other hand, is the internal experience that a person has as they interact with every aspect of a company’s products and services.

2. User Interface Design Basics

User Interface (UI) Design focuses on anticipating what users might need to do and ensuring that the interface has elements that are easy to access, understand, and use to facilitate those actions. UI brings together concepts from interaction design, visual design, and information architecture.

Users have become familiar with interface elements acting in a certain way, so try to be consistent and predictable in your choices and their layout. Doing so will help with task completion, efficiency, and satisfaction.

Everything stems from knowing your users, including understanding their goals, skills, preferences, and tendencies. Once you know about your user, make sure to consider the following when designing your interface:

  1. Keep the interface simple
  2. Create consistency and use common UI elements
  3. Be purposeful in page layout
  4. Strategically use color and texture
  5. Use typography to create hierarchy and clarity
  6. Make sure that the system communicates what’s happening
  7. Think about the defaults

3. 10 Interface Design Fundamentals by Kyle Sollenberger

  1. Know your user
  2. Pay attention to patterns.
  3. Stay consistent
  4. Use visual hierarchy
  5. Provide feedback
  6. Be forgiving
  7. Empower your user
  8. Speak their language
  9. Keep it simple
  10. Keep moving forward

Resources

  1. LinkedIn Topic
  2. SlideShare
  3. Usability.gov — your guide for developing usable & useful Web sites
  4. User Interface Engineering by Jared Spool
  5. Nielsen Norman Group by Jakob Nielsen
  6. Web Design Practices by Heidi Adkisson
  7. Redesigning a Knowledge Management System for Usability by Cheryl Carroll
  8. James Robertson Information Architecture and Usability
  9. Effective Visual Communication for Graphical User Interfaces by Suzanne Martin
  10. Using Light, Color, and Contrast Effectively in UI Design by Dmitry Fadeyev

Courses

  1. User-Centred Design
  2. The 1-Hour UI Audit: Free Crash Course for Finding & Fixing Design Problems in Web Applications
  3. User Experience Design by Julia Debari
  4. Introduction to User Experience Principles and Processes by Mark Newman of the University of Michigan
  5. Introduction to UI Design: 5 Coursera Online Courses by the University of Minnesota
  • Introduction to UI Design
  • User Research and Design
  • Prototyping and Design
  • Evaluating User Interfaces
  • UI Design Capstone

Books

  1. Designing Web Interfaces: Principles and Patterns for Rich Interactions by Bill Scott and Theresa Neil
  2. The Elements of User Experience: User-Centered Design for the Web and Beyond by Jesse James Garrett
  3. Information Architecture for the World Wide Web: Designing Large-Scale Web Sites byLouis Rosenfeld, Peter Morville, and Jorge Arango
  4. Designing Interfaces: Patterns for Effective Interaction Design by Jenifer Tidwell
  5. Amazon

Written by

Knowledge Management Author and Speaker, Founder of SIKM Leaders Community, Community Evangelist, Knowledge Manager https://sites.google.com/site/stangarfield/

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store