The document discusses using HTML5 to improve user experience (UX) when developing Oracle products. It proposes leveraging HTML5 capabilities to allow faster prototyping, using off-the-shelf components like speech recognition, and adapting UX based on device sensors to understand the user's context. Examples are given of building prototypes in HTML5 and using the speech API to create an intelligent assistant. The document encourages learning more about Oracle's focus on usable applications and UX best practices.

1. Copyright © 2014, Oracle and/or its affiliates. All rights reserved. Confidential – Oracle Internal
1

2. Copyright © 2014, Oracle and/or its affiliates. All rights reserved.
Safe Harbor
The following is intended to outline our general product
direction. It is intended for information purposes only,
and may not be incorporated into any contract. It is not
a commitment to deliver any material, code, or
functionality, and should not be relied upon in making
purchasing decisions. The development, release, and
timing of any features or functionality described for
Oracle s products remains at the sole discretion of
Oracle.!
!
!

3. UX Directions
with HTML 5
Noel Portugal,
Principal UX Developer
March 18, 2014
Nieuwegein, NL

4. Copyright © 2014, Oracle and/or its affiliates. All rights reserved. Confidential – Oracle Internal
Extensibility
Tailor the user experience
to best fit your company’s
identity and business
processes.
Simplicity!
Easily access the
essential information
and actions to support
your work. !
!
Oracle’s User Experience Strategy is About …
Mobility!
Optimized UIs for
wherever and however
you work.
!
!
4

5. Copyright © 2014, Oracle and/or its affiliates. All rights reserved. Confidential – Oracle Internal5
Faster Prototyping with HTML5
§ Backend: Use Fusion WS to do our (Business Logic) bidding
§ Frontend: plain HTML5 Web Application
– Ajax calls to interact with Backend (REST services provided by CRM-
Server)
– CSS (FUSE Bootstrap) to make it look like an ADF build application
§ Advantages
– Leverage ALL web technologies, even if not available in ADF
§ Example 1: V 0 -> V 0.1 -> V0.2
§ Example 2: V1!
Using off-the-shelf components

6. Copyright © 2014, Oracle and/or its affiliates. All rights reserved. Confidential – Oracle Internal
Faster Prototyping with HTML5
§ Using HTML5 Speech API
§ Demo
§ < 50 lines of code, demo-able in a day
§ Leverage off-the-shelf components
– Wolfram|Alpha for brains
– HTML5 Speech API!
Siri in your browser (iriS)
6

7. Copyright © 2014, Oracle and/or its affiliates. All rights reserved. Confidential – Oracle Internal
Better UX Using HTML5
§ Get to know the user, his device and his surroundings
– Is your user on a Broadband connection? How strong is the signal? (demo)
– How much battery does the user have left? (demo)
– How bright is it where the user is? (demo)
– Where in the world is the user? (demo)
– Where is the device in relation to the user (orientation and proximity)?
– Is the page visible? (demo)
§ Adapt the user experience accordingly!
Beyond Responsive Design
7

8. Copyright © 2014, Oracle and/or its affiliates. All rights reserved.
HTML5 Demo!DEMO
8

9. Copyright © 2014, Oracle and/or its affiliates. All rights reserved.
• Oracle.com/UsableApps
• Blogs.oracle.com/VoX
• Blogs.oracle.com/UsableApps
• Twitter.com/@usableapps
Learn More About Oracle Apps UX Online
9

10. Copyright © 2014, Oracle and/or its affiliates. All rights reserved. Confidential – Oracle Internal10

11. Copyright © 2014, Oracle and/or its affiliates. All rights reserved. Confidential – Oracle Internal
11