ECM on the Go. A Quick Start iPad Application for Mobile Content Management

1. ECM on the Go:
A Quick Start iPad Application forA Quick Start iPad Application for
Mobile Content ManagementMobile Content Management
Presented by Fishbowl SolutionsPresented by Fishbowl Solutions
6.14.2012

2. Agenda
Who is Fishbowl
Fishbowl Mobile ExperienceFishbowl Mobile Experience
Mobile App & Web Solutions Through Responsive
DesignDesign
Mobile Innovations
Fishbowl iPad Quick Start Program

3. About Fishbowl Solutions
100+ deployments in last 2 years
Focused on portals & content management since 1999Focused on portals & content management since 1999
Solutions offerings & value-add components forSolutions offerings & value-add components for
Oracle WebCenter
Oracle Specialized Gold Partner for WebCenterOracle Specialized Gold Partner for WebCenter
Content & WebCenter Portal

4. About Fishbowl Solutions
WebCenter Mobile User Experience Design
SharePoint Integration Google Search IntegrationSharePoint Integration Google Search Integration

5. Fishbowl – Leader in Mobile ECM
Experience
2+ years research and development
Numerous POCs:
iTwitter Portlet– iTwitter Portlet
– Oracle WebCenter Spaces iPhone
– Oracle WebCenter Spaces Native application
ExpertiseExpertise
iOS and Android
Objective C, REST, HTML5, ADF Mobile
Responsive design and skinning
Customer Successes
Medical device manufacturer and therapy services provider currently deployed
with 6,000 iPads
Photo eye and sensor manufacturer went live on April 1, 2012Photo eye and sensor manufacturer went live on April 1, 2012
Award Winning
Forrester Groundswell – Employee Mobile Application - Management
Oracle Fusion Innovation – Oracle WebCenter ContentOracle Fusion Innovation – Oracle WebCenter Content

6. Medical Device Manufacturer Streamlines
Overall Sales Process
Customer Profile:
World leader in medical equipment and therapies for
cardiovascular, neurological, and musculoskeletal disorders,
chronic health conditions, and surgical procedureschronic health conditions, and surgical procedures
38,000+ employees worldwide
Solution Summary:
WebCenter application for the iPad that includes navigation
structure, touch gesture response, and security parameters
Business Drivers:
“I am amazed how quickly I
can find a PDF and prepare
for my next meeting. The
amount of time I haveBusiness Drivers:
Increase sales process efficiency
Ensure highest accuracy of product and services collateral
Display and interact with 3D images and rich content
amount of time I have
between cases varies, so not
needing to load my laptop
and waste time booting and
searching for materials makes
Customer Benefits:
Time to market improvement
Reduced printing and storage costs
searching for materials makes
the iPad and mobile ECM a
big productivity gain for me.”
Sales RepresentativeReduced printing and storage costs
Increase in employee, partner, customer satisfaction
Sales Representative
Cardiovascular Division

7. Customer Application Screenshot
6,000 Users
in Feb 2012in Feb 2012

8. Sensor Manufacturer Expedites Access
to High Value Content
Customer Profile:
Manufacturer and distributer of photo eyes, sensors and associated
products for industrial and process automation.
3,000 factory and field representatives and millions of customers3,000 factory and field representatives and millions of customers
worldwide.
Solution Summary:
WebCenter application for the iPad and Android tablets that includesWebCenter application for the iPad and Android tablets that includes
navigation structure, touch gesture response, security parameters, and
Google Analytics integration.
Business Drivers:Business Drivers:
Gain competitive advantage by expediting availability of product collateral
to sales and distribution
Further leverage centralized content repositoryFurther leverage centralized content repository
Customer Benefits:
Increased accuracy and availability of sales and marketing collateral
Further leverage central content repositoryFurther leverage central content repository

9. Customer Application Screenshot
Live on
April 1, 2012
Welcome
April 1, 2012
Welcome

10. Business’ Perspective
Better management, organization &
presentation of materialspresentation of materials

11. Use Case: Sales Enablement
Business Problem
– Limited time to prepare for meetings
– Time to market lag for new sales and
marketing collateralmarketing collateral
– Inefficient meetings due to laptop boot
times and paper reliance
Relevant Features
– App:– App:
• Store content for use in offline mode
• Synch content
• Custom folders for easy navigation
• Email cart• Email cart
• Download and usage analytics
– Tablet:
• 3D, high-resolution platform
• Instant On• Instant On
• Long Battery Life
Benefits
– Increase sales process efficiency
– Ensure content accuracy and availability– Ensure content accuracy and availability
– Reduced paper handling costs

12. Use Case: Field Service
Business Problem
– Environments not conducive to
laptops
– Need to view and interact with
Relevant Features
– App:
• Store content for use in offline mode
• Synch content– Need to view and interact with
detailed diagrams, pictures or
schematics at scale
– Referencing outdated manuals, parts
lists, etc.
• Synch content
• Custom folders for easy navigation
• Touch gestures – zoom in/out, rotate
– Tablet:
• Highly portable – 2 poundslists, etc.
Benefits
– Decrease time spent servicing or
maintaining machines and systems
• Highly portable – 2 pounds
• 3D, high-resolution platform
• Instant On
• Long Battery Life
maintaining machines and systems
– Enable access to visually rich images
and drawings
– Ensure content accuracy and
availabilityavailability

13. Day In the Life: Sales Meeting
Before
Find collateral
(1 hour)
Print & organize
(30 minutes)
Download
(10 minutes)
• 250 Prep Hours/Year
• $600 Print Costs/Year
Frantic Freddie
• Inefficient Meetings
• Non-Interactive
During Boot laptop Open all assets
Switch
between assets
After
Return to
Email assets
Prepare for
• Low Close RatesAfter
Return to
office
Email assets
Prepare for
next meeting
Before
Find and Add Collateral to Customer Folder
(5 minutes)
• Reduced Prep Time
• No Print costs
- Show and interact with content
• Efficient Meetings
• Highly Interactive
• High Close Rates
During
- Show and interact with content
- Email content
After Go to next meeting
• High Close RatesAfter Go to next meeting
Confident Connie

14. Mobile App & Web Solutions
Fishbowl Solutions Mobile ECM Offerings
Mobile App & Web Solutions
Through Responsive Design

15. WebCenter Interface & UX Design
+ Experience
• Responsive Design
Visually Rich, Interactive, and
Responsive Design• Responsive Design
• Reusable templates
• User Interface skinning
+ Expertise
Responsive Design
+ Expertise
• ADF Mobile
• REST API• REST API
• HTML5
• CSS3
• Phonegap• Phonegap

16. Responsive Design
Fishbowl Solutions
Responsive Design
Consulting Services

17. What is Responsive Design
Responsive Web design - approach that suggests thatResponsive Web design - approach that suggests that
design and development should respond to the user’s
behavior and environment based on screen size,behavior and environment based on screen size,
platform and orientation.
+ As the user switches from their laptop to iPad, the website
should automatically switch to accommodate for resolution,
image size and scripting abilitiesimage size and scripting abilities

18. Responsive Design Services
+ Templates for WebCenter Content Sites
+ One template automatically adjusts for desktops,+ One template automatically adjusts for desktops,
tablets, and smartphones
+ Leverages CSS3, HTML5,+ Leverages CSS3, HTML5,
and JavaScript within
WebCenter Content, PortalWebCenter Content, Portal
& Sites
+ Fishbowl has expertise in both+ Fishbowl has expertise in both
responsive web design and designing for the
Oracle WebCenter platformOracle WebCenter platform

19. Responsive, Adaptive Design
Fluid Grids – Liquid Layouts
Flexible ImagesFlexible Images
Break Points
Media Queries
Touch of JavaScriptTouch of JavaScript
Multi orientation and resolution support
Flexible layoutFlexible grid
system
Flexible
media
Flexible layout
through media
queries

20. Fluid Grids & Liquid Layouts
Base Framework Skeleton
Can scale to any resolutionCan scale to any resolution
Wraps content & Grids
Can Support Desktop to Mobile with 1Can Support Desktop to Mobile with 1
template

21. Flexible Images
Scalable Images
100% Width attribute100% Width attribute
Device Image
OptimisationOptimisation
Desktop - Mobile
WebCenter ContentWebCenter Content
Conversion Server

22. Break Points
Defining flexible template
Resolution Break PointsResolution Break Points
Break Points are always changing!

23. Media Queries
Muscles & Skin
CSS QueriesCSS Queries
– Screen resolution &
orientationorientation
Single Base multiple
LooksLooks

24. Touch of JavaScript
Browsers don’t all support CSS3 Media queries
Custom JS implementation incorporated
– to support Browsers like IE.– to support Browsers like IE.

25. Demo

26. Mobile Application Innovations
Fishbowl Solutions
Mobile Application Innovations

27. WebCenter Spaces Oracle iPhone App
Overview:
iPhone Access to WebCenter Spaces
– Manage connections– Manage connections
– Group projects
Features & Benefits:Features & Benefits:
Easily consolidate messages
Clean, recognizable UIClean, recognizable UI
People Connection search
Local file system and “Open In”Local file system and “Open In”
support
Bookmark favorite items

28. WebCenter Spaces
Fishbowl Mobile Collaboration
Overview:
Native Application – iOS, BlackBerry, Android
and Windows Access to WebCenter Spaces
– Manage connections
– Group projects
– Access WebCenter via browser
Features & Benefits:
Synchronize content
3 touch content upload
Pull content from external sources
Interactions cached for offline access
Portable to ADF Mobile
Technologies:
HTML5, CSS3, Phonegap

29. Demo

30. Oracle Desktop Integration Suite – WebDav
WebCenter Content WebDav Folders
managementmanagement

31. WebCenter Spaces
Mobile Integration Suite
Overview:
• Native Application – iOS, BlackBerry, Android
and Windows Access to WebCenter Content
•
and Windows Access to WebCenter Content
– Manage Assets within Webcenter Content
Webdav Folders
Features & Benefits:
• Synchronize content
• Media uploads – photo & video• Media uploads – photo & video
• Interactions cached for offline access
• Portable to ADF Mobile
Technologies:
• Jquery Mobile, HTML5, CSS3, Phonegap

32. Demo

33. Engaging With Fishbowl Solutions
Positioning for Develop Mobile
Responsive Design
template update to
WebCenter
Positioning for
WebCenter Portal
& Sites Integration
through the REST
Develop Mobile
Application Similar
to LinkedIn
Phase 1 Phase 2 Phase 3
WebCenter through the REST
API
Phase 1 Phase 2 Phase 3

34. The Future and what we can do now to
enhance the users journeyenhance the users journey
Voice EnablementVoice Enablement
Device Integrations – Mobile touch, gamepads
Touch Events PS5Touch Events PS5
Spatial Gesture Integrations –
Kinect Xbox360 & PC

35. Software & Services Offering to Extend
Fishbowl Solutions iPad App Quick Start Program for WebCenter
Software & Services Offering to Extend
WebCenter Content to the iPad

36. Why Quick Start
World Leaders in WebCenter Mobility
Similar Customer NeedsSimilar Customer Needs
Customer Want a Solution That Is:
– Easy to Use– Easy to Use
– Proven and Successful
– Quick Launch Time

37. Mobile Quick Start Defined
Native iPad Application
Search & Browse for ContentSearch & Browse for Content
Maintain WebCenter Security
Online & Local Content LibrariesOnline & Local Content Libraries
View Content
Share Content via Email to Secure Download SiteShare Content via Email to Secure Download Site
Organize Local Content into Folder Structure
Metadata-Driven Navigation for Virtual FolderMetadata-Driven Navigation for Virtual Folder
Browsing

38. Launching in Less than a Month
Navigation
Definition
LaunchSkinning & UI
Integration
Email Cart
Configuration
Metadata
Tuning
TestingAnalytics
Integration
Digital Signing
Definition IntegrationConfiguration
Define
navigation
hierarchy
structure
Taxonomy for
content
availability, sort
order, and
filters
File download
component
installation and
configuration
Skin with
corporate color
scheme & logo
User Testing
Tuning
Launch App
Integration
Integration with
Google
Analytics
Apple
Enterprise
Deployment
Signing
DAYS 1-4 DAYS 12-14DAYS 4-10 DAYS 10-12 DAYS 20-25DAYS 14-17 DAYS 17-20 DAYS 25-30DAYS 1-4 DAYS 12-14DAYS 4-10 DAYS 10-12 DAYS 20-25DAYS 14-17 DAYS 17-20 DAYS 25-30

39. Starting from Scratch
Application
Development
Navigation
Definition
LaunchEmail Cart
Configuration
Define File download User Testing
Testing
Launch App
Analytics
Integration
Integration with
Digital Signing
Apple
Develop custom
iOS application to
communicate
with WebCenter
Content and view,
Define
metadata
navigation
hierarchy
structure
File download
component
installation and
configuration
User Testing Launch AppIntegration with
Google
Analytics
Apple
Enterprise
Deployment
Signing
with WebCenter
Content and view,
download, sync,
store, and email
content from
within the iPad.
DAY 100
within the iPad.
DAY 100
DAYS 1 - 75DAYS 1 - 75

40. Architecture

41. App Overview

42. Primary Nav
Navigate to 5 Primary Views
– Online Content Library– Online Content Library
– Local Content Library
– Folders– Folders
– Email Cart
– Global Search (Online or Local)– Global Search (Online or Local)

43. Online Content Library
Online
WebCenter
RepositoryRepository
9-Up Grid View
Swipe for MoreSwipe for More
Thumbnails
Touch to ViewTouch to View
Long-Press
ActionsActions

44. Local Content Library
Local WebCenter
Repository
Offline Access
9-Up Grid View
Swipe for MoreSwipe for More
Local Thumbnails
Touch to ViewTouch to View
Long-Press
ActionsActions
Sync with Online
Version

45. Global Search
Available Local or
Online
12-Up Grid View
Keyword Search
Sort by Title orSort by Title or
Date

46. Folder View
Add from Address
Book
Type in Addresses
Send to Multiple
Badge IndicatorBadge Indicator

47. Email Cart
Add from
Address Book
Type in
Addresses
Send to MultipleSend to Multiple
Badge Indicator
SecureSecure
Temporary
Download Site

48. Quick Filters
Four quick filters
Metadata Query Define FiltersMetadata Query Define Filters
– Can be complex or simple queries
One at a timeOne at a time

49. Left Nav
Virtual Folder Nodes
Metadata DrivenMetadata Driven
Multilayer Navigation
Mirrored for Online & LocalMirrored for Online & Local
Stored in Content Server asStored in Content Server as
HCST Configuration File

50. Left Nav

51. Sync Content
Keep local copies
up-to-dateup-to-date
– Sync local content with
latest versionslatest versions
Local Library
Local FoldersLocal Folders
Navigation
Help Files

52. Maintain WebCenter Security
Secured Content
– Sign in with– Sign in with
WebCenter
credentialscredentials
– Users only see items
they have access tothey have access to
– Configurable login
time caching

53. Additional Content Security
Metadata-Based Security
– Normal – Save local & Email– Normal – Save local & Email
– Restricted email delivery
– Restricted viewing with 3rd party application– Restricted viewing with 3rd party application
– On-Line Veiwing only
Optional File EncryptionOptional File Encryption
– For storage on local device file system
Cannot encrypt video– Cannot encrypt video

54. Settings
Control What
Content You SeeContent You See
Hide Irrelevant
ResultsResults
Metadata Driven
ExamplesExamples
– Language
– Types
– Industry– Industry
– Product Line

55. Help
Help Files in
WebCenterWebCenter
Automatically
Stores HelpStores Help
Locally
Syncs Updates
Multiple Types
– Video
– Images– Images
– PDF
– etc.

56. Analytics
Integration with
Google AnalyticsGoogle Analytics
Built in Event Tracking
See who’s using the app
See what content is…See what content is…
– Viewed most
– Shared most– Shared most
– Not viewed

57. Analytics Examples

58. Skinning
Graphic Replacement
– Keep Layout– Keep Layout
– No image resizing
Flexible Engagement ModelFlexible Engagement Model
– You provide color & logo, we skin
– We provide file names & dimensions, you skin– We provide file names & dimensions, you skin
Retina Resolution Ready
– Support for new iPad Retina Display

59. Skinning

60. Fishbowl Skin

61. Sample Skin

62. Fishbowl Skin 2

63. Landing Pages
Online, Local, & Folder
Home Screen
Stored in WebCenterStored in WebCenter
Automatically Sync
Support for:Support for:
– HTML
– PDF
– PNG– PNG
Use Possibilities
– Corporate Logo– Corporate Logo
– Getting Started Guide
– Featured Company Info

64. Code Signing
Enterprise signing
– Requires Apple Enterprise Account– Requires Apple Enterprise Account
– App does not need Apple Approval
– Can be given to partners or employees– Can be given to partners or employees

65. Demo

66. Questions?Questions?

67. What’s Next
Meet with a Fishbowl
WebCenter Mobile ExpertWebCenter Mobile Expert
Schedule a Demo
Contact Us for More Info
• 952.465.3400• 952.465.3400
• info@fishbowlsolutoins.com
NEW! Android Tablet AppNEW! Android Tablet App
– Also Available

68. Questions?Questions?

69. Fishbowl Summer Webinar Series
Preview Fishbowl's
SharePoint Connector for OracleSharePoint Connector for Oracle
WebCenter Version 2.0 –
Beta Customers Wanted!Beta Customers Wanted!
– June 21st, 12pm CST
register:
fishbowlsolutions.com/news

70. Contact Us
web: fishbowlsolutions.com email: info@fishbowlsolutions.com
phone: +1.952.465.3400 blog: cfour.fishbowlsolutions.com
twitter: @FishbowlE20
facebook: facebook.com/fishbowlsolutions
linkedIn: join our groups
webcenter content & webcenter portal