Monday Apr 27, 2015

Interested in Lift-Off for Your Cloud Business?

Julian Orr (@Orr_UX), Senior Usability Engineer in the Oracle Applications User Experience Communications and Outreach team reflects on the OAUG Collaborate 15 conference.

Much like the very real sand cloud that enveloped Las Vegas during this year’s OAUG Collaborate 15, the conference itself is getting drawn deeper into the Oracle Cloud, as more Oracle applications lift off and soar towards the Oracle Applications Cloud user experience and look and feel.

I co-presented three sessions with Oracle Cloud Applications partners at the conference. All three sessions focused on how to extend and complement the functionality of the Oracle Applications Cloud using a combination of PaaS for SaaS (or PaaS4SaaS as we call it). Common themes included:

  • PaaS is an agile, effective means used to extend SaaS cloud applications as proven by our partners.
  • Oracle PaaS is not just used to extend SaaS functionality, but it’s also used to extend the user experience benefits of the Oracle Applications Cloud simplified UI to your users.
  • Applying best practices helps users reap the many benefits of the simplified user experience.

In the Oracle Fusion Middleware for the Cloud panel session, Sandeep Banerjie, Senior Director, Oracle Product Management, did a great job of setting the table with comprehensive coverage about Oracle Cloud current and future offerings.

Julian Orr, and Basheer Khan at the Oracle Fusion Middleware for the Cloud panel

(L-R) Sandeep Banerjie, Julian Orr, and Basheer Khan at the Oracle Fusion Middleware for the Cloud panel [Photo by Natasha K. Rogers (@NatashaKotovsky)]

I used my time to describe how the Oracle Applications User Experience team worked with Basheer Khan, (@bkhan) CEO of Knex Technology and OAUX Speaker, and its customers in an intensive onsite design workshop to rapidly develop a simplified approach for accurately assigning a constantly changing cadre of new hires to project resources to enable accurate management and accounting. Basheer followed my coverage of the simplified design process with a live demo the PaaS application that we co-designed.

The panel was well received, with a few nods for involvement of end users in the design process and demonstrated success in PaaS rapid development. The majority of the questions we addressed were focused on cloud security features.

Debra Lilley extols the user experience value of using PaaS for SaaS solutions.

Debra Lilley extols the Oracle Partner business value of using PaaS for SaaS solutions.

In the two sessions about using Oracle PaaS to Extend Oracle Cloud Applications, I joined Debra Lilley (@debralilley), Vice President of Cloud Services at Certus Solutions, Oracle ACE Director, and OAUX Speaker; and Ian Carline, Executive Vice President - Product Development at Certus Solutions, to discuss the design workshop we conducted with Certus to use PaaS to extend the Oracle HCM Cloud cloud functionality.

Debra and Ian did powerful jobs of stressing the absolute need and value of having a consistent user experience across PaaS and SaaS applications. My part of the presentation emphasized how to achieve a simplified user experience by focusing on these three things:

  • Design work: Before coding begins, employ a simplified design process that involves use-case review with end users and user advocates, sketching, and wireframing.

Following the presentation, much of the discussion centered on how to determine which use cases would make prime candidates for PaaS4SaaS projects.

As more partners and customers start designing and building PaaS solutions for the Oracle Applications Cloud SaaS offerings, I expect we will see that questions will begin to focus more and more on user experience. If it is not already, it will become, clear that to differentiate and win business in the cloud partners building and customizing enterprise apps need to compete on user experience as well as functionality. 

Interested in lifting off your business?

Monday Jul 07, 2014

Designing a Naturally Conversational User Experience for the User Interface

By Georgia Price and Karen Scipi

Think about the software applications you like most. Why do you like them? How do they make you feel? What is your experience like when you use them? The most successful user interfaces—those that delight users—focus equally on the intersection of visual, interaction, and language design.

Visual and interaction design get a lot of play in the enterprise software development environment. Yet language design directly impacts a user’s ability to complete tasks. The use and arrangement of general words, specialized terms, and phrases on the UI promote a naturally conversational voice and tone and inform and induce user actions.

Simply put, the words, terms, and phrases that we promote on a UI either facilitate or hinder the user experience and either delight or frustrate the user.

As Oracle Applications User Experience language designers, we took this message on the road last month as featured speakers at the Society for Technical Communications Summit, where we presented two papers: Designing Effective User Interface Content and The Unadorned Truth About Terminology Management: Initiatives, Practices, and Melodrama.

Society for Technical Communication Summit logo

If attendance is any indication, our message resonated with many. More than 115 people gathered to hear us talk about how designing language for the UI is just as important when building effective, simplified user experiences as creating the right interactions and choosing the right images, icons, colors, and fonts. Dozens lined up after our talks to ask questions and to learn more, making us realize that many others who build software applications  are also grappling with how to design language to enable more simplified user experiences.

Perhaps we can pique your interest! Over the coming weeks, we'll share our thoughts and experiences on language design. Stay tuned to the Usable Apps blog to learn more about what language design is and how we use words, terms, and phrases, as well as voice and tone, to help build simplified user experiences and easy-to-understand UIs.

Wednesday May 28, 2014

Oracle Applications Cloud Release 8 Customization: Your User Interface, Your Text

Introducing the User Interface Text Editor

In Oracle Applications Cloud Release 8, there’s an addition to the customization tool set, called the User Interface Text Editor  (UITE). When signed in with an application administrator role, users launch this new editing feature from the Navigator's Tools > Customization > User Interface Text menu option.

See how the editor is in there with other customization tools?

User Interface Text is launched from the Navigator

User Interface Text Editor is launched from the Navigator Customization menu

Applications customers need a way to make changes to the text that appears in the UI, without having to initiate an IT project. Business users can now easily change labels on fields, for example. Using a composer and activated sandbox, these users can take advantage of the Oracle Metadata Services (MDS), add a key to a text resource bundle, and then type in their preferred label and its description (as a best practice for further work, I’d recommend always completing that description).

Oracle Composer used to change field labels

Changing a simplified UI field label using Oracle Composer

In Release 8, the UITE enables business users to easily change UI text on a much wider basis. As with composers, the UITE requires an activated sandbox where users can make their changes safely, before committing them for others to see.

The UITE is used for editing UI text that comes from Oracle ADF resource bundles or from the Message Dictionary (or FND_MESSAGE_% tables, if you’re old enough to remember such things).

Functionally, the Message Dictionary is used for the text that appears in business rule-type error, warning or information messages, or as a text source when ADF resource bundles cannot be used. In the UITE, these Message Dictionary texts are referred to as Multi-part Validation Messages.  

If the text comes from ADF resource bundles, then it’s categorized as User Interface Text in the UITE. This category refers to the text that appears in embedded help in the UI or in simple error, warning, confirmation, or information messages.

The embedded help types used in the application are explained in an Oracle Fusion Applications User Experience (UX) design pattern set. The message types have a UX design pattern set too.

Using UITE 

The UITE enables users to search and replace text in UI strings using case sensitive options, as well as by type. Users select singular and plural options for text changes, should they apply.

Searching and replacing text in UIT

Searching and replacing text in the UITE

The UITE also provides users with a way to preview and manage changes on an exclusion basis, before committing to the final result. There might, for example, be situations where a phrase or word needs to remain different from how it’s generally used in the application, depending on the context.

Previewing tech changes before saving

Previewing replacement text changes. Changes can be excluded where required.

Multi-Part Messages

The Message Dictionary table architecture has been inherited from Oracle E-Business Suite days. However, there are important differences in the Oracle Applications Cloud version, notably the additional message text components, as explained in the UX Design Patterns.

Message Dictionary text has a broad range of uses as indicated, and it can also be reserved for internal application use, for use by PL/SQL and C programs, and so on. Message Dictionary text may even concatenate at run time, where required.

The UITE handles the flexibility of such text architecture by enabling users to drill down on each message and see how it’s constructed in total. That way, users can ensure that any text changes being made are consistent throughout the different message parts.

Multipart messages in UI

Multi-part (Message Dictionary) message components in the UITE

Message Dictionary messages may also use supportability related numbers, the ones that appear appended to the message text in the application’s UI. However, should you have the requirement to remove these numbers from users' view, the UITE is not the tool for the job. Instead, see my blog about using the Manage Messages UI.

Wednesday Jan 08, 2014

Designing the Language Experience of the User Interface

When you think about any user interface (UI) guideline and you hear “language of the user,” what do you think?

  • I should be able to understand the words I see on the UI.
  • The words I see on the UI should be meaningful to the work that I do.
  • The words I see on the UI should be translatable and localizable.

The usability of business applications has evolved, and business applications have become more consumer-focused. The average user’s understanding of business applications has evolved as well. Technology and know-how now allow us to build contextual user experiences into applications and to design language experiences for the UI—with style, tone, terms, words, and phrases—that resonate with real users and their real, every day work experiences in the real world, across the globe.

For example, on the Oracle Human Capital Management Cloud My Details page, notice how the sections are organized, how they use real-world terms in headings and field labels, and how they use real content, such as personal and biographical details instead of placeholder text, which cannot be evaluated for its meaning or translation or localization needs.

Oracle Human Capital Management Cloud My Details page

Choosing which terms, words, and phrases to include on the UI is as important as choosing the right terms to use in code. In code and on the UI, the terms and words should be accurate in context and enable the successful completion of a task in context, whether the context is the processing of an event in the code or the user adding information to a contact record on a form in the UI.

37signals book, Getting Real, dedicates a short essay, Copywriting is Interface Design, to the importance of copywriting in UI design and how important every single word choice on is for the UI.

There are also numerous resources that support that choosing terms, words, and phrases for the UI that accurately represent real-world concepts in their source language often enables the translation and localization experiences. For examples, see Ultan Ó Broin’s Blogos entry Working Out Context in the Enterprise: Localize That! and Verónica González de la Rosa and Antoine Lefeuvre’s slideshare ‘Translation is UX’ Manifesto.

So how do we design a rich, context-aware UI language experience for today’s user?

  • We use accurate terms to represent concepts that are well-established in the real world by real users. These are the terms that users use frequently, terms such as team or shopping cart.
  • We use terms consistently to represent the same concepts across applications. We wouldn’t use location in one place and party site in another to represent the same concept, or save and submit to represent the same concept.
  • When we need to use these terms in context of phrases on the UI, we do so with a style and tone that resonates with users and yet is still translatable and localizable. This means that we don’t introduce nonsensical words or instant messaging-speak. We offer phrasing that is simple and clear: Add a new customer record.
  • We stop surfacing the language of the application on the UI, for example, code-specific terms. When we use a term like worker in the code as an abstraction or a superclass to represent the concept that a person can assume the role of “employee” or “contractor” in the system, this use makes sense in context of where and how it is used in code. When we surface the term worker on the UI to represent either or both roles, we introduce a context-independent use of this concept and one that when tested, we learn is not necessarily translatable or localizable in such a context.

Jakob Nielsen in his 1995 article 10 Usability Heuristics for User Interface Design identified a need for this practice of using language choices that resonate with real users: “The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.”

A simplified UI is simple to build, simple to extend, and simple to use. Use and context awareness require us to build applications that focus equally on code, visual design, and language (UI) design. Every page that we surface to the user should make sense to the user in context of his work and the real world. The practice of designing the language that is used on the UI offers us an extraordinary opportunity to evolve how we communicate with users to enable their work everywhere.

Wednesday Jul 24, 2013

Resources for Building Oracle ADF Applications

Interested in building a compelling, consistent, and flexible user experience with a user interface to support simple, intuitive interactions but not sure where to start? 

This entry lists the best resources to use to get started building great applications using the Oracle Applications Development Framework (ADF) technology. However, if you’re already an ADF developer, you can fast-track your learning curve by checking out our top 10 reads: Top 10 Things to Read If You’re a Fusion Applications Developer.

List of Oracle Fusion Applications resources

List of Oracle Fusion Applications resources 

The following table highlights the four key resources that we use when building ADF components and pages for Oracle Fusion Applications and offers examples for when to apply the information in each of these resources.

I’m building an ADF table, and I need to . . . Resource Use when . . .
Identify components and guidelines that I will need Oracle ADF Component Specifications You want to see examples and demonstrations of components, validators, converters, and miscellaneous tags, along with a property editor to see how attribute values affect a component.
Determine information design and  elements Oracle ADF Rich Client User Interface Guidelines

Your focus is data visualization, rich web user experience, visual development.

For example, if you were building a table, you would find guidelines for table design and table elements. Specific design and element guidelines include:

  • Layout
  • Row banding
  • Column formatting
  • Row height
  • Vertical and horizontal scrolling
  • Read-only or editable data

Add specific core and task-dependent features and interactions Oracle Fusion Applications Usage Guidelines

You’re looking for Oracle Fusion Applications-specific features and interactions that enable a cohesive user experience through the consistent placement and behavior of user interface elements.

Examples include:

  • Common and special icon types
  • Tasks pane
  • UI Shell

Apply  common and proven design and interaction patterns that align with industry best practices Oracle Fusion Applications Design Patterns  You want to apply common design patterns. Design patterns comprise common page designs that are built to accommodate common requirements that have been identified by the industry as best practices and have been proven by real users in our usability labs. Generally, our design patterns are delivered through JDeveloper as composite components, or they offer instructions on how to use ADF components.

Interested in learning more? 

See:

Wednesday Jul 10, 2013

Visual Design for Any Enterprise User Interface (Art School in a Box)

By Karen Scipi and Katy Massucco, Oracle Applications User Experience

"What color is Facebook?" Without thinking, you know it's blue. This isn’t by accident. So, what is the science behind visual design in enterprise user interfaces? 

Visual design is an essential part of the user experience. A well-designed user interface starts to become invisible to the user. It's naturally pleasing, and it doesn't create tension or roadblocks. It starts to feel like a comfortable shirt; you don't notice it. A poorly designed user interface feels like an ill-fitting shirt with a scratchy tag on the neck; you're going to notice it, and it's going to annoy you.

We've all seen visual designs that have made us cringe. And we've all seen visual designs that have made us feel good. Have you ever thought about what the differences are between these types of experiences, or why one resonates with you more than the other?

Any number of key elements affect visual design and users' responses to the design. We offer one that we consider key to users wanting to use an application or website that goes beyond usability and appeals to their emotional side: branding. Of course, you should also consider other aspects when designing a user interface for an enterprise application. All of these elements add up to helping "delight and excite" users, which results in productivity—for them and their businesses. 

Why branding? Because branding is the "hook." A well-considered brand gets noticed, so does consistency across a user interface. Branding is more than a logo. Branding represents the overall "personality" or impression of the design, and it is supported by these next few key design elements.

Color 

Color impacts the brain. A user draws conclusions from the ways that color is applied.  Color can work to your advantage if you understand how color works and is perceived by users. However, applying colors that violate this understanding can work to your disadvantage. For example, a color may have different meanings in different parts of the world. A good practice for controlling colors is applying a product coding strategy.

Examples of color usages

Examples of color usages

Contrast

Contrast is the difference between two adjacent colors. In our user interface designs, we consider these points:
  • Good contrast is central to the legibility of text. 
  • The highest contrast is black text on a white background, such as those used in books, newspapers, and dense online text.
  • Poor contrast can cause eye strain for users, even for those users with good vision.
  • Poor contrast can render a page illegible, especially for users with compromised vision.
  • Accessibility standards require a minimum level of contrast.

Examples of text on color contrasts

Examples of text on color contrasts

Layout

Layout focuses on how components and content are arranged on a page. A layout should optimize the natural way that content is read and scanned by a user. A page layout should consider and complement the reading order of a language (left-to-right or right-to-left). The content should be grouped and arranged logically and should establish relationships among objects that appear on that page.

Eye tracking enables user experience designers to determine where users' visual attention is focused. The data that we collect from our eye-tracking usability studies helps inform layout and other design aspects that we've proven might better accommodate users' natural reading tendencies.  

You might wonder why even small changes in layout and where you position components and content on a page are important. Changes can be interpreted as swimming upstream: you are fighting the natural order of things when you don't conform to established and proven practices, such as reading order. Even tiny spurts of lost user productivity can turn into death-by-a-thousand-cuts for an enterprise, as proven by Oracle Applications User Experience and industry science

Examples of left-to-right and right-to-left language reading order

Examples of left-to-right and right-to-left language reading order

Spacing

Spacing, such as white space and padding, is a powerful design element. When used deliberately, blank areas on a page can be used to break up the density of content on the page and to give the eye a place to rest or focus.

Examples that show how padding creates resting places for the eyes

Examples that show how padding creates resting places for the eyes

Font

Font choice reflects the personality of the site, for example, the brand. Conservative fonts, such as sans serif ones, are generally more easily read. Eclectic fonts, such as serif fonts or script, offer a trendier impression.

Font color and text styles also enhance (or not) the readability of the text, so they should be used deliberately. Consider that:
  • A color change within a block of text draws the eye to it and makes the user think that the text is different in some way, for example, a link, which is set in a different color from the text that surrounds it.
  • Bold text draws the eye to it and should be used to emphasize a word or a block of text. 
  • Italic text can be difficult to read online. It becomes either blurry or jagged, depending on the quality of the font and users' screens.

Examples of sans serif and serif fonts

Examples of sans serif and serif fonts

Icons

Icons are small images that powerfully impact comprehension. The eye is drawn immediately to an icon on a page rather than to a text button that contains the same information. When used, icons should differ enough in shape and color so that the user can identify the differences by simply scanning the page. 

The frequency of use should consider that the average user can process and understand a limited number of icons, their meanings, and their relationships among other icons—for example, status icons—at any one time. Our research yields that the average user can hold five icons in their thoughts at any one time. When the number of icons increases above five, our research yields that users' comprehension becomes compromised because there are simply too many meanings and relationships to consider and understand. 

Icons draw the eye to them, so they should be used judiciously. Too many icons on a page can add a lot of visual noise. When overused, users' eyes will bounce around the page from icon to icon. 

Devices

As we've moved into a more device-agnostic era, we've had to think about how to build enterprise applications for use across different devices. To control the overall visual design across devices and to ensure consistency and promote reuse across pages, we've centralized our style classes in a cascading style sheet (CSS). We also:
  • Use fallback fonts to control the appearance of the user interface if the device uses different system fonts. 
  • Test our CSS in different browsers and on different operating systems.
  • Avoid relying on images to colorize elements or add curves or gradients because they require manual image editing to revise.

The visual design aspect of any enterprise application can be quite complex. While we didn't cover every aspect of visual design in this blog entry, we hope you walk away with an understanding of what we consider the key element of visual design to be as well as its supporting visual elements for our enterprise applications. 

Interested in learning more? 

See:


About

Welcome to the Usable Apps in the Cloud blog.

Learn more about us at
Usable Apps

Search

Categories
Archives
« May 2015
SunMonTueWedThuFriSat
     
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
      
Today