Interfaces and UX Design

Brienne Hayes and Sergio Huerta

Part 1: History of UX Design

The first, and perhaps most critical, development in interface design was the transition from users accommodating interfaces to interfaces accommodating users. In evolving from punch-cards to command line interfaces to graphical user interfaces, designers gradually gained the ability to design hardware and software that did not assume expertise or training on behalf of the user. The next critical development was customizability: once users were able to interact with a computer without specialist training, it became important for users to be able to define their own digital interactions to streamline frequently needed actions.

Part 2: What Is a Browser Interface?

A browser interface typically consists of two components: a content display and a navigational display. The content display dictates how retrieved content is relayed to the user; in most modern internet browsers, this is accomplished by visually rendering the HTML and CSS dictated by a webpage, while older browsers could only display raw HTML or plain text. The navigational display provides the tools a user needs to locate the content shown in the content display. Modern internet browsers typically allow users to directly enter web URLs, perform internet searches, or visit “bookmarked” webpages, all through a simple graphical interface of buttons and clearly defined text fields. Before graphical interfaces, the navigational display of a browser would consist entirely of the command line commands that dictated how web content was retrieved.

Part 3: The Eight Golden Rules of UX Design

1. Allow users to interact with the interface using a consistent set of commands.
   • Example: Mapping Indigenous LA presents its information in a consistent StoryMap format, so a user that can navigate one page of the site can navigate the rest.
2. Allow users to streamline their most frequently used commands.
   • Example: Reconstructing Hayti has a simple command template that suggests successive actions, streamlining the process of “drilling down” on a piece of information.
3. Reassure users that their commands are working as expected.
   • Example: Bracero uses the same metadata format for different types of media.
4. Inform users when commands terminate successfully.
   • Example: Reconstructing Hayti highlights command buttons to inform the user they can take their next steps.
5. Inform users when their commands are contributing to errors.
   • Example: Slave Voyages returns no results when a user enters improper filtering arguments.
6. Allow users to reverse their commands without repercussions.
   • Example: Rethinking the Region has a clear site map, making navigating its pages backwards and forwards simple for users.
7. Reassure users that their commands are driving the interface.
   • Example: Digital Harlem is entirely responsive to user input, letting the users commands dictate the way the story is being told.
8. Prevent users from getting bogged down in the details. 
   • Example: Slave Voyages can present the same data in multiple views that do not conflict with one another.

Assumptions:

• These rules assume that a user is taking an active role in engaging with the interface. Digital Harlem, for example, provides little information to a user who is not attempting to construct their own narrative through the tool.
• These rules assume the user is familiar with broader interface techniques. The Bracero Archive, for example, would be difficult to use without an understanding of how to navigate a webpage or download files.
• These rules assume that the user is human. The information in Rethinking the Region is largely locked off from automated users.

What does/doesn’t work?: All of the above projects rely predominantly on graphics and text to communicate information, ignoring other potential methods of presentation that are not visual.