Case study that summarizes key findings by Red Pill Development as they built a mobile interface for Notes applications at Salvation Army. Using asymmetric modernization a mobile interface can be delivered for an entire portfolio of applications in a few days.
2. www.redpilldevelopment.comlearn. do. dream.
Executive Summary
Mobilize 100s of Notes applications in days
Install on existing Domino server or XWorks appliance
No changes required to existing applications
Browser-based - no offline storage of data on device
Operates on iOS and Android (HTML 5) devices
Access via a single Notes database
Requires no coding for standard functionality
Fully customizable using IBM XPages
3. www.redpilldevelopment.comlearn. do. dream.
Mobile
Everybody
is getting
one
Used to
get work
done
Mobile
projects will
dominate IT
agendas
In 2012 the total number of smartphones &
tablet devices shipped exceeded that of PCs.
Morgan Stanley Research
By the end of 2017 there will be more
mobile devices on Earth than people.
CISCO
Worldwide business mobile devices
are projected to grow from 889 million
in 2012 to 1.4 billion by 2016.
Radicati
CIOs expect over 20% of their employees
to use tablets instead of laptops by 2013.
Gartner
By 2015 mobile application
development will account for
80% of all development
activities.
Gartner
4. www.redpilldevelopment.comlearn. do. dream.
• Mobile solution developed in conjunction with Salvation Army’s
USA Southern Territory headquarters in Atlanta, GA.
• The goal was to deliver a mobile interface for five applications in
three months.
• Six weeks later, the redpill used our portal software to mobilize
38 applications in a single day (by one person).
• Customer chose to deploy 22 of these applications into
production along with two additional (new) applications. It took
15 minutes (each) to add and customize the extra applications.
• To provide non-confidential data for this case study, the original
“Lotus Nifty Fifty” was mobilized. This comprises 80 databases.
An additional 20 databases were created using standard
templates provided by IBM as part of Notes 9.0.
• One person established a basic mobile interface for all 100
applications in 35 minutes. An additional 20 hours was spent
customizing the interface to enhance its usability.
• Phase two includes enhanced edit capabilities and a tablet-
specific interface.
Project Summary
5. www.redpilldevelopment.comlearn. do. dream.
Project Scope
Existing Notes Applications
• Take investment made over past 20 years
• 100s/1,000s of applications
Read-Only Interface
• Content consumption is dominant use for
mobile devices
• Edit interface to follow
80%+ of Databases
• Some complex applications will require
custom solutions
Rapid Deployment
• 10+ applications in one day (one person)
• Zero effort for many, large effort for few
XPages 8.5.3 UP1 (or later)
• XPages Extension Library
• Mobile Controls
• Dojo 1.6
iOS/Android Devices (Phone)
• Webkit, HTML5 & CSS3 based
• Tablets will work but advantage is not
made of additional screen real-estate
6. www.redpilldevelopment.comlearn. do. dream.
Key Success Factors
Mobile Experience: XPages Mobile Controls
Architecture: Single XPages Application
Programming Language: Java over SSJS
Productivity: Code/Data Forensics
Skill Transfer: Mentoring
Assistance: XPages Community
Support: Salvation Army
8. www.redpilldevelopment.comlearn. do. dream.
The Importance Of Design
• The key to mobilizing a large number of
applications is to find the patterns that are
common to most applications and providing
a (customizable) generic solution for those
patterns.
• The Notes workspace and 3-pane UI provides
a consistent approach used by 80%+ of Notes
applications.
• Finding Containers:
– Workspace grouped into tabs
– Bookmarks (used by a minority)
• Finding Documents:
– Views/Folders (Outline/Navigator)
– Search
• Displaying Data:
– Labels and Values (often in a table)
– Grouping into tabbed tables, sections
11. www.redpilldevelopment.comlearn. do. dream.
The Potential Of XPages
“The true power of XPages will only be unleashed
when people avoid the temptation to develop
XPages applications the same way they developed
Notes Applications.”
Peter Presnell, CEO Red Pill Development
12. www.redpilldevelopment.comlearn. do. dream.
The Process
Use code and data
forensics to define the
structure of your
applications
Develop/acquire a
gateway that uses XPages
to translate this data into
a mobile interface.
Review the result and
fine-tune the
configuration to deliver a
superior user experience
Integrate a feedback
mechanism for users to
report issues and request
enhancements.
Customize complex
application logic using
XPages
Gather analytics to better
understand the dynamics
of how your applications
are being used
13. www.redpilldevelopment.comlearn. do. dream.
• redpill Forensics
– Eclipse Plug-Ins
– Data and code forensics run on server (server
security)
– Initial and on-going analysis
– Runs on one or many servers
• redpill Graph
– Data loaded/maintained by redpill Analytics
– Graph representation stored in Notes documents
– Manual configuration of portal using:
• Notes Client (.domino Framework)
• Web Client (One UI)
• Mobile Client (redpill Mobile)
• redpill Mobile
– Single NSF portal for all applications
– Implemented Using:-
• Standard XPages (heavy use of extension library and
mobile controls)
• CSS
• SSJS and JS Libraries
• Java classes (Beans)
• redpill components
redpill
Forensics
redpill
Graph
redpill
Mobile
Portal Components
Opportunity:
Portal specifically designed to take advantage of IBM XWorks
licensing
14. www.redpilldevelopment.comlearn. do. dream.
The basic functionality of Notes applications is
represented using a data model that includes:-
• Application: A grouping of one or more Notes
databases
• Container: A single Notes database
• Collection: Groups of documents as found in
views or folders
• Object: A series of documents with a similar
data model, usually defined by a form
• Representation: The layout used to display
data for an object
• Item Container: A natural grouping of items in
a section, table, table tab, layer etc.
• Item: Data items (Editable Fields), Computed
Text, Static Text
For this project separate Notes documents are
created to represent each of these objects. A graph
structure is used to define the relationships
between the objects.
Data Model
Application
Container
Collection Object
Representation
Item
Item
Container
17. www.redpilldevelopment.comlearn. do. dream.
• Provide a listing of available applications
• Exclude system (and other) databases
• Show groupings of similar applications
based on template, department, folder
etc. to improve navigation.
• Identify my applications and/or the ones I
can access.
• Put the most frequently used applications
at the top of the list
• Allow me to search for an application
Application Selection: Needs
Excluding mail servers:
10% of database are system databases
15% of databases are development/test/backup
45% of databases have not changed in the past year
85% of databases have not had design changes in the
past year
25% of databases have not been accessed in the past
year
18. www.redpilldevelopment.comlearn. do. dream.
• Implement using XPages dataView control to display list of
applications and containers defined in mobile portal.
• Compile a list of applications
• Create rules to filter out system databases using:-
– Template Name
– Filepath
– Replica id
– Database title
• Identify applications not being used:-
– Database last accessed
– Content last created/modified
– View Indexes not built
• Identify applications not suited for mobile devices
• Accurately label each application (less is more)
• Use reader fields to control who sees which applications
• Group/categorize applications based on:
– Template
– Department
– Filepath
– System Analysis
Application Selection: Solutions
Opportunities:
(1) Use dojo mobile TreeView (experimental) to allow large groups
of Notes databases to be represented as n-level tree
(2) Allow users to customize their own structure for the applications
they use
19. www.redpilldevelopment.comlearn. do. dream.
• Scan catalog.nsf for information about applications and/or crawl
databases on each server.
• A server-sided operation is needed to reduce security issues when
scanning databases local to that server.
• Look at both design and data
– Design = what programmer intended
– Data = what users are doing
• Build rules for identifying system databases
• Build rules for identifying backup, development, test databases
• Record database statistics
– Document count
– Date last accessed
– Date last document created
– Date last document modified
– Date design last changed
• Keep a complete list of applications and mark those to be excluded.
• Continually monitor servers for changes
• Add additional code to applications and/or servers to track additional
data
• Record usage in mobile portal for later review
• Use this opportunity to remove unwanted applications from servers.
Application Selection: Automation
Opportunities:
(1) Track usage of applications and sequence based on usage.
(2) Identify affinities between users and applications and make
suggestions to other “like” users.
20. www.redpilldevelopment.comlearn. do. dream.
• Provide a list of commonly used
views/folders (collections)
• Display only those views I am likely to use
from a mobile device
• Put the ones I use most at the top
• Label views in a way that is is easy to
relate back to the original application. E.g.
if outline used then use similar text as
outline labels rather than view names
Collection Selection: Needs
40% of views are hidden
15% of views are used for administration
35% contain no data or do not have view indexes that are built
21. www.redpilldevelopment.comlearn. do. dream.
• Implement using XPages dataView control to display
list of collections defined in mobile portal.
• Eliminate collections hidden from Notes client (use of
parens in name or hide properties set)
• Eliminate views containing “copy”
• Eliminate private views/folders
• Identify calendar views for special treatment.
• Identify views whose primary purpose is reporting.
• Flag views containing keywords such as admin, dev.
• Review outlines/navigators to find views that are
hidden based upon roles.
• Define/review collections suitable for mobile
interface.
• Review labels to eliminate unnecessary text
• Applications will often share the same list of views.
Linking these applications together can reduce the
effort to define and maintain these collections.
Collection Selection: Solution
Opportunities:
(1) Use dojo mobile TreeView (experimental) to structure collection
in a manner similar to Outlines (n-levels)
(2) Allow users to customize their own structure for the collections
they use
22. www.redpilldevelopment.comlearn. do. dream.
• Scan the design of existing databases to compile a base list
of views/folders
– Exclude hidden views
– Exclude Web-only views
– Exclude administration views
• DXL Export of Outlines and Navigators can establish:
– Labels to be used
– Order to list views
– Hide-when conditions for views
• Identify views with red-flag terms such as copy of, test or
backup
• Look for outline groups for entire outlines that contain
admin, developer etc. These may not be needed in the
mobile interface
• View indexes not built on any replica suggest view is not
used
• Keep the complete list of collections, marking those being
excluded. This will allow on-going design forensics to
correctly identify additions/changes.
• Identify applications that share a common set of collections
to reduce maintenance
Collection Selection: Automation
Opportunities:
(1) Track usage of collection and sequence based on usage.
(2) Hidden designs can slow down the process. Review policy and
clean up databases before starting analysis
23. www.redpilldevelopment.comlearn. do. dream.
• I need to see category values and an identifier
(summary column) for each record.
• I’m using a phone (portrait orientation) so don’t
crowd the display with too many columns.
• For a tablet device I am more open to having
additional columns displayed.
• Provide reports as PDFs instead of using a view or
exporting to Excel.
• Display additional “detail” information when a
single column doesn’t identify the record.
• Allow me to expand/collapse categories and
response documents
• Provide icons to identify document types or
workflow state
• All me to quickly jump to a specific point in large
views
• Allow me to search for documents
• Display views in calendar format
Document Selection: Needs
75% of views are uncategorized
24% of views have 1-2 levels of categorization
1% of views have more than 2 levels of categorization
<0.5% of views use a calendar format
24. www.redpilldevelopment.comlearn. do. dream.
• Implement using XPages dataView control to
display existing view/folder in application
• Analysis of design can identify programmatic
names of categorized columns used.
• Identify field typically used to define content of
documents (e.g. Title) or programmatic column
• Optional: Identify use of view icon column
• In selected cases consider adding a new view or
changing an existing view to better facilitate the
display on mobile devices.
• The dataView control provides a mechanism for
both a full text search of content as well as to
start the display at a particular value.
Document Selection: Standard
Issues Encountered:
(1) For response documents unable to display different summary
column
(2) Total rows display as blank rows
Opportunities:
(1) Tablet UI can add additional columns (Extra Columns) to make
use of additional screen real-estate.
(2) A TreeGrid may provide an alternative representation for
categorized views.
0-1
min
25. www.redpilldevelopment.comlearn. do. dream.
• For a small number of views (~ <5%) it is
not possible to nominate a single (existing)
summary column to identify each record.
• The dataView control provides a details
facet that can be used to display additional
information (rows) for each document.
• Create a small custom control to define the
layout for this additional data and include
the name of the custom control to be used.
• An <xp:include> tag can be used to
conditionally include this custom control
within the detail facet of the dataView.
Document Selection: Custom
Opportunities:
(1) Define s “Standard” Collection in which it is only necessary to identify additional
columns to be used within the Details facet.
5
mins
26. www.redpilldevelopment.comlearn. do. dream.
Document Review: Needs
• I typically only need to see a small subset of the
data held.
• The content needs to be easy to read.
• I need to see rich text content and
attachments.
• I want to use controls familiar to me for my
mobile device.
• I would like to integrate data displayed with
applications on my device:-
– Phone (phone numbers)
– Mail (email address)
– Browser (url links)
– Map (addresses)
– Camera (capturing images)
– GPS (capturing addresses)
– Attachments (documents, spreadsheets,
presentations)
– Multimedia (audio, video links/content)
• A tabular/grid display is OK in many
circumstances but not all.
Default
Representation
Standard
Representation
Custom
Representation
27. www.redpilldevelopment.comlearn. do. dream.
• Use extension library formTable control
• Title: Identify title used for each object (options
include summary column for collection or the
Form name)
• Item List: Form or document can be used to
identify list of items and their data type
• Sequence: Items are usually stored in a
document in the same sequence they appear on
a form that first created them
• Control Type: Based upon a number of factors:
• Data Type
• Multiple Values
• Number of allowed values
• Type of device being used
• Available screen resolution
Default Representation
Opportunities:
(1) Matching of labels in forms/columns will provide a more user
appealing output.
(2) Automatic identification of patterns for phone numbers,
addresses, email addresses etc. can generate automatic
integration with native applications.
(3) Develop a universal control that adapts to the data/device
building into place best-practice for design.
0
mins
28. www.redpilldevelopment.comlearn. do. dream.
Standard Representation
• Define a representation containing:-
– A formula to be used for the title
– A list of fields to be displayed when a document or
a particular type (form) is displayed.
– The sequence in which the fields should be listed
– The label to be displayed with the field value
– The preferred control to be used. Use this to
identify email, phone numbers, addresses, etc.
• Use extension library formTable control with
repeat control for each item defined
• Construct a custom control that display the data
using the designated control inside a formRow.
• (Optional) Add logic to hide fields without values.
• Customization requires ~2 minutes per
representation.
Opportunities:
(1) Data forensics can be used to identify objects using the same data
across multiple applications.
(2) Dojo Mobile TreeView can be used to represent both large and
complex grouping of fields
(3) Add support for computed items and static text where these are
important.
(4) Build a TreeView structure that groups items to allow for the
display of more complex forms such as sections and tabbed
tables.
2
mins
29. www.redpilldevelopment.comlearn. do. dream.
Custom Representation
• Used where the requirements fall outside the standard
representation Define an XPages Custom Control to display
the data in a wide range of formats.
• In the representation for the object provide the name of the
custom control to be used.
• The <xp:include control can be used to conditionally include
this custom control for documents with custom
representations defined.
• Use of the TableRow control is strongly recommended to
organize data. This will deliver a consistent UI with that
provided by default and standard representations.
• Responsive design can be included as part of the design.
• Customization requires 10+ minutes per representation.
• Having made the effort to build a custom control, look for
other databases that may use a similar form. Common design
patterns such as contact details can be easily shared across
multiple object.
Opportunities:
(1) Use of XPages Bazaar as alternative mechanism for storing custom
representations.
(2) Enhance capabilities of Standard Representation to reduce need for
this (more expensive) option.
(3) The dojo ScreenSizeAware control could provide greater options for
displaying content on tablet devices
10+
mins
30. www.redpilldevelopment.comlearn. do. dream.
Editing Content
• Because a custom representation
is created using an XPages custom
control there is almost no limit on
the functionality that can be
delivered. This includes the ability
to edit content.
• To overcome keyboard limitations
content can now be provided from
native mobile capabilities
– GPS (current address)
– Camera (photos)
– Voice Recorder (text)
Future Direction:
(1) Editing capabilities will be added as part of both default and
standard representations.
(2) New XPages components will be delivered to provide a superior
experience when editing content from a mobile device.
10+
mins
31. www.redpilldevelopment.comlearn. do. dream.
• The CK editor used by XPages is not
supported on mobile devices.
• computedText with URL content type will
render a lot of rich text content in a
suitable format.
• Embedded attachments are removed and
a reference to their name embedded into
the text (see following slide).
• Attachments must be handled separately
(see following slide).
• The real issue with Rich Text comes about
when there is a need to edit its content.
A number of incompatibility issues must
be addressed and will be covered in the
next case study.
Rich Text
Opportunities:
(1) Override IBM’s renderer for a more complete representation of rich
32. www.redpilldevelopment.comlearn. do. dream.
File Attachments
• Develop a custom control that is
bound to a document instead of a
field, displaying all attachments
without needing to know which
fields contain attachments.
• For smartphones: Show minimal
amount of information about each
attachment (attachment name
only).
• Use FileRowData class to represent
each attachment for consistency
with XPages File Download Control.
• Consider the differences between
XPages URL syntax and standard
Domino URL syntax for attachments
33. www.redpilldevelopment.comlearn. do. dream.
• Search Options:
– Goto: Move to first entry in a list
that starts with characters
– View: Scan for text displayed in
view
• <input type=‘search’ can help
control the behavior of a search
control that changes with the type
of device.
• Utilize the onsearch event of the
search control to integrate with
the mobile devices’ search
functionality.
• Use a bean (Java class) to connect
the activity of the search control
with the content displayed in the
dataView control.
Search
Opportunities:
(1) Analysis of index contents to provide type-ahead capabilities based
upon the database content.
34. www.redpilldevelopment.comlearn. do. dream.
Feedback
• The solution should not
stop with the initial
implementation.
• Customization efforts can
better focused if the
needs of your users can
be captured.
• Feedback should be an
integral part of the
mobile solution and not
something added as an
afterthought.
36. www.redpilldevelopment.comlearn. do. dream.
Operating On Mobile Devices
When deploying Notes applications
to mobile devices we must cater for
the smaller screen size and the
reduced keyboard capabilities.
We can, however, enhance the user
experience for these applications by
integrating the content with the
growing number of native
applications now common on these
devices.
Maps
Phone
Mail
GPS
Camera
Voice Input
37. www.redpilldevelopment.comlearn. do. dream.
Maps
• Addresses can be indispensible for
mobile users providing directions to an
address from the current location.
• Create a URL link with specific URLs for
iOS and Android devices.
• Latitude/longitude coordinates can be
used or traditional street addresses.
• Incorporate this inside a standard
component or custom control.
• Consider modifying applications to
consolidate address components into a
single field, or develop a control
capable of accepting multiple address
components.
Opportunities:
(1) Implement dojo Map control to avoid need to navigate away from browser
application.
38. www.redpilldevelopment.comlearn. do. dream.
Phone
• Use tel: protocol protocol as
part of a URL link to cause
mobile device to connect to
native phone application.
• <Input type=‘phone’ will ensure
edit controls will display a
keyboard consistent with
entering phone numbers.
• Incorporate this inside a
standard component or custom
control.
39. www.redpilldevelopment.comlearn. do. dream.
Mail
• Use mailto: protocol as part of
a URL link to cause mobile
device to connect to native
mail application.
• Incorporate this inside a
standard component or
custom control.
40. www.redpilldevelopment.comlearn. do. dream.
GPS is used to assist with data capture.
• Use mobile device GPS to load
current location, including a
breakdown into Street Address,
City, State, etc.
• Reduces need for data entry – a
weakness for mobile devices.
• Improves accuracy and/or
completeness of information
collected.
• Geotag data to track where/when
information is being collected
• Opportunity to integrate with Map
application to provide directions
from current location.
GPS: Needs
41. www.redpilldevelopment.comlearn. do. dream.
GPS: Solution
• Javascript library
geolocation.js used to enable
location services on the
mobile device.
• The Google Maps API can
then be used to translate the
geo coordinates to address
information.
• Develop a custom component
to provide address
information when creating
new content.
42. www.redpilldevelopment.comlearn. do. dream.
Photo capture is used to assist with
data capture.
• Take a new photo or
use an existing photo
• Allow multiple
photos to be added
• Display thumbnails to
review photos added
(avoid mistakes)
• Delete photo added
in error
Camera: Needs
43. www.redpilldevelopment.comlearn. do. dream.
• <input type=‘image’ will
trigger mobile devices to
interact with the native
camera application.
• Choices are provided to
use an existing photo or
take a new photo.
• Show thumbnails of the
photos already
uploaded as a way of
visually confirming
progress.
Camera: Solution
44. www.redpilldevelopment.comlearn. do. dream.
Voice Input
• Many mobile devices include
voice input as an alternate to
entering text (e.g. Siri on iOS).
• XPages text controls
automatically support this
capability provided:-
– The capability is supported on the
mobile device
– The capability has been enabled
• Provides an alternative for
entering large amounts of
text.
Opportunities:
Users of some Notes applications may prefer to use their mobile device
just to take advantage of this capability.
45. www.redpilldevelopment.comlearn. do. dream.
Conclusions
• Mobile solutions are changing the way business operate and
compete.
• As a direct result of this project Red Pill Development has
established and verified a process and technology that can
deliver a low-risk, cost-effective solution to organizations that:-
– Have 100+ Notes applications
– One server with Domino 9.0
– One week to invest
• It is not necessary to reproduce the entire functionality of the
existing Notes application for projects to be a success.
• The combination of an asymmetric approach and the Redpill
technology makes it possible to provide a mobile interface to an
existing portfolio of Notes applications within a few days/weeks.
• Customization should require less than one hour per application.
• If the existing applications remain untouched testing and support
costs are eliminated along with the risk of interruption to
important business processes.
• Users do not hate the Notes applications they are using. They
are just not in love with the way they are presently being
packaged.
• A mobile first strategy provides a launch-pad for the
modernization and rejuvenation of existing Notes applications. It
also acts as a stimulus for new opportunities that exploit the
capabilities of mobile devices.
Less Risk
Lower Cost
48. www.redpilldevelopment.comlearn. do. dream.
Acknowledgements
• This project would not have been the help it was without the
fabulous support provided by the IT Team at Salvation Army. A
big thank you to Colonel Ward, Bill Davison, Daoud Safi, David
Alt, Jim Powers, Tim Ward and the many others that helped this
project to be a success.
• A lot of hard work was required by the Red Pill team to make the
ultimate solution so easy. The project team comprised Nathan T
Freeman, Keith Strickland, and Peter Presnell.
• Tim Tripcony and Jennifer Meade provided invaluable assistance
to develop some of the ideas that helped this project be a
success.
• The amazing “Lotus” community was always there to help when
technical problems were encountered. I would name them all but
I would worry that I might leave somebody out. You know who
you are….
Peter Presnell, CEO
Nathan T Freeman, Chief Architect
Keith Strickland, Senior Engineer