SlideShare a Scribd company logo
The „Client‟ Template
- illustrated!

Randy Carey

iCueProject.com
The “client” template is a new approach as to how
the client maintains their website and web content
…and a new demand as to what we as website
developers build and deliver to the client.
What is a client template?
What does it look like?
What value does it add?
Why should I care?
Note: This is a slightly modified version of the
presentation given at the 2013 World Joomla Conference.

Tailored to make the slides more meaningful as a non-live
presentation, I am including summary text to each slide.
A CMS, such as Joomla, provides to interfaces to the website: frontend and backend.
The front-end caters to the needs of one audience – the public who
comes to interact with the client‟s site.
The backend is an interface to manage the website and its content.
This single interface servers two audiences:
[1] The website integrator architects and builds the site. This user
leverages his/her expertise of the CMS and website architecture.
[2] The “client” and staff manage the site‟s content over the
lifetime of the site. This user-type leverages his/her domain
expertise in the business.
The CMS community often challenges itself…
to improve the admin template.
This challenge struggles with the natural tension: On one hand, by giving the
site integrator a more powerful CMS the interface naturally grows more
complex. Meanwhile, the needs of the client argue towards a simpler
interface.
So what things do we make simpler (shift to the right)?
…and what things do we enrich (shift to the left)?
Can we rebalance this tension so as to make the admin template better?
Henry Ford, mass producer of the automobile, is rumored to have said…

If I had asked people what they
wanted, they would have said faster
horses.

This irony is that what his consumers thought they wanted was an
improvement of the tool they had been using: horses. If they only had
“faster horses.”
But history proved that the consumer valued not the tool but what the
tool delivered (transportation). The improvements that they really
wanted was in that value (transportation) and most consumers would
willingly discard the tool (horses).
Returning to the challenge we tend to embrace
“to improve the admin template”
… I think we will never be satisfied with our results. The quest is based
upon a “faster horses” type assumption (focusing on the current tool as the
only option).

Rephrase the question to what we really want
“How can we improve our client’s ability to manage their website?”
That new perspective allows us to accept a new approach…
I suggest we find a breakthrough with this different approach:
Give the client their own interface to managing the website
(the „client‟ template).

Stop making one interface (the traditional admin template) try to serve two
different user types (admins vs clients).
By providing the client with their own interface, we can deliver one that
is simpler to user and tailored to the tasks that the client needs to
perform.
It is true that this approach adds to the role of the site integrator:
This role not only designs and builds the front-end user experience – now
this role is responsible for installing/configuring the new client experience.

But this enables us to deliver to our clients a level of usability that adds
significant value. This added value is something our clients want – and what
our competitors are not offering.
Simplify and Tailor
What you are seeing is an example of the client interfaces that I have
been delivering in Joomla 2.5. The two key words here are “simplify”
and “tailor.” Because I deliver a „client‟ version to the backend, I can
tailor the interface to the each client‟s needs. And that allows me to
remove all the unneeded options and technical terms.
Now I‟d like to show some backend
interfaces that I have been delivering to
my clients.
FIRST, I will focus on the situations where
the site is managed by a single person
(in contrast to a team with segmented roles).
This is for a Lawyer who provides services to businesses and non-profits. His
main navigation is the “Quick Links” section near the top. Icons and short
text provide a starting point to the common tasks he performs when logging
in to his site: manage web content, newsletter content, newsletter campaign,
and fee table.
Because the single person is also the site owner, I provide admin modules
that report site traffic as well as the MailChimp dashboard for his newsletter
campaign results.
This is for a registration site for electrician training classes. Again, the
common tasks have been identified, and their starting points are
available as a quick link: access to the various types of
classes, registrations, event locations, page content, and job listings.
Because the user is the site owner, the site statistics are shown.
Notice that when the user clicks a link for a special type, she is brought
to a particular listing pre-set to display only a particular category of
classes. How do we do that? How do we create a link that sets filters on
the resulting page?
We can preset filters through the URL parameters – shown above in red.
At the HTML level, each filter is represented as a filter with a name or id.
And each option in the dropdown has a value. We can preset the filter
by declaring the name of the input to be set to the value we want to set.
We can even pre-set ordering and the search box.
?option=com_modules&task=module.edit&id=17

And by using a pattern as shown above we can create a link that takes
one directly to the edited screen for a particular module. This can be
very helpful is there is one or a few modules that our client regularly
wants to update directly.
Examples:
…where the site is managed by
a team of users, and their responsibilities
are segmented.
Client is a theater production company.
Here are two differing views, each displaying a different role. The upperleft is for the content manager who maintains page content. The lowerright is for the ticket manager who manages ticket sales/pricing as well
as transaction data. Note that each role gets a simple view of what it
needs to access, and nothing more (not even site reports).
Client: a county (government) with over 20 departments and divisions.
Each department has its own role, and each role will see a set of quick
links like you see here – each set tuned to give access to the resources
just for that department.
Here are the user groups that represent a
department. For each checked group, that
user will be given that role‟s set of quick
links. Typically, each department has access
just to its own set of quick links.
Of course, there are some within the organization that need
access to other aspects of the site. In this example, the
user has been assigned to the roles (user groups) of
calendar management, employment section, and
announcement.
Notice that I chose not to give these users any menu item
other than a link back to the dashboard. By returning to
the dashboard, a user returns to all the options, grouped
neatly as shown here.
In sites with segmented user roles, most roles include just a short set of
quick links. However, I usually need to create a “webmaster” role that
grants access to menu items and reporting.
And in reality, the person assigned to webmaster is
often assigned to additional roles. So the webmaster
role has access to menu and reporting items, and
each additional role provides an additional set of
quick links.
One large site had five languages, so I replicated all sets of quick links
for each language. And as I showed earlier, each link that led to a list
also preset the language filter. (Yes, this did take a lot of extra configuration
work, but the client had the need to segment by language, and Joomla allowed
me to provide that.)
The client interfaces that I‟ve shown are using the Mission Control admin
template. But this template reached its end-of-life in Joomla 2.5. I
could not find a 3.x admin template that allowed me to provide as simple
of a client view as I could in 2.5. So… I have built my own prototype.
Keynote at Drupalcon 2013

Karen McGrane

This community is so well positioned to tackle this
problem. You have a powerful, flexible framework. And you
have access to real users so you can

prototype and test new interfaces. You
are designing the user experience for
the content creators.
Start thinking like a UX designer, start thinking
like a content strategist, and

invent the future.

Well-known information strategist, Karen McGrane, discussed this issue
at a recent Drupalcon. Quoted here is her concluding paragraph, and I
found it to resonate with the approach of the iCue Project…
Build prototypes and test to see what works.
By being forced to build from scratch, I found myself able to take the
concept of „client‟ template further. I no longer simply wished for a
feature – I tried to build what I thought a client template should have.
What I‟m showing next are screenshots of my 3.x prototypes. These are
currently being reworked into installable extensions to be made available
through iCueProject.com
First, let‟s review the features found on Isis, the default admin template of 3.1.

It contains a menu bar of hard-coded menu items. The content area
(outlined here in red) includes a sidebar menu that can‟t be changed and a
list of quick links that is set to always include about a dozen items.
Additional admin modules are included by default, but can be removed
through the module manager
This is not a blank screen. It is my client template out-of-the-box.
I took an extreme minimalist approach with my client template. When it is
installed, it is like a black page awaiting for the site integrator to specify
which admin templates are to be added to it.
The only things provided initially are a link back to the dashboard, a link to
view the front-end of the site, and a dropdown for the user to change his/her
account or to log out.
Those are the only things I felt were needed universally.
My client template does not include the 3.x set of assumptions and modules
for the admin‟s “home page.”
In contrast, this version provides several module positions that can be used
for arranging all sorts of admin modules: quicklinks, reports, campaign
dashboards, etc.
Of course, we have to add navigation. The client template assumes that the
site integrator will use a tool to create and assign these
But since we now have control of creating navigation, and since we have
isolated the client‟s interface, …we ought to tailor navigation to the client.
[1] That means using terms that the client is familiar with.
[2] It also means identifying the most common tasks for this user and
organizing the navigation around those tasks and not according to the logical
organization we developers have come to expect. For example, instead of
articles and categories, we might use “page content,” “services,”
“testimonials,” and ”announcements.” Don‟t under value or overlook the IA
(information architecture) that we should tailor to our clients.
I found myself needing to build the tool for creating dashboard icons.
Again, the burden of having to build my own afforded me the ability to think
about what more things I should be adding and then do so.

This is the current version of the edit screen for Client Links. I do recognize
other ought-to-haves and plan to add them, such as a wizard that allows you
to generate a URL that presets filters on a given form.
Last year I wrote this article for the Joomla magazine that suggested we give
our clients their own menu in the backend using the IA and terms relevant to
the client. Because the admin template is hard-coded, the solution then was
to override the layout file.
NOW, since my client template does not include the default admin menu
bar, I created a tool for creating and tailoring a client menu bar.
Here you can see the client menu bar added to the dashboard.
Since we are now responsible for the client template‟s navigation, we need to
pay attention to IA and navigation issues. For instance, is it wise to use both
a menu and quicklinks. If we use both, how can we vary the two so that the
combination adds value without being redundant.
My preferred approach is to use just quick links and require a user to finish
working within a component and hit the “dashboard” button before he/she
can jump to another component or task. Of course, power users probably
want both, and I do accommodate.
backend
templates

Admin
template

Client
template

By this point it is obvious that my 3.x prototype is no longer an “admin”
template. The result arguably is a new type of backend template - a “client”
template that is distinct from the admin template in terms of its features and
assumptions.
backend
templates

Admin
template

Client
template
Up to this point I have been focusing on the admin “home” page, or
“dashboard” page. The client template must also handle lists views and
edit forms as supplied by the component.
I modeled the layout after what I‟ve been delivering in 2.5 with the Mission
Control template.
I did run into limitations in that 3.x delivers the ordering of parts (subnavigation, filters, search, list) in a fixed bundle – so I had to work within
some imposed coding.

List view
Here is an edit screen
for an article just as
we get it from the
component. Notice all
fields are displayed
whether they are
needed or not.
Another article that I wrote last year was on simplifying and tailoring the edit
screens to our client‟s needs.
In this example we see the edit screen for a product in a store. The tailored
version removes unused fields, shifts important fields to the main tab, and
adds styling to the field labels to denote if a field is required, important, or
ignorable.

simplify & tailor edit screens
Here is a tailored version of
an article edit screen. The
“title” field is red to denote
required. Some fields are
read only (category, status).
Many fields are not
needed, so they are not
displayed.
I was able to create a tool
that allows the site
integrator to create multiple
versions of admin edit
screens – for any given field
we can declare it to be
hidden, read-only, of a
certain importance
level, and the default value.
So instead of overriding a
layout file, the changes are
made through a
configuration screen.
Here is the result of
the “Article
Options” tab when
set to show only
four fields of the
twenty-some that
are shown by
default.
Here is an example of a minimized version of the Contact form. On the main
tab the fields are Name, Linked User, Information and Tags.
Category, Language, Published and other fields are preset to default values
and not even shown.
The “Contact Details” fields is reduced
to just those fields that are needed
(the list tailored to the client‟s needs).
The other tabs are all blank because
we‟ve tailored those fields to be hidden
in this version.

I do plan to return to this to see if I can
find a way to hide tabs that have no
content.
Tailor JCE

Although technically not part of the template, I think the editing toolbar is an
important feature that ought also be simplified and tailored as needed.

You might not have notice, but what is shown here is the result of some JCE
buttons that I created and added. Originally my custom buttons were meant
to be labels to help group the toolbar buttons. Note that “bold” is under the
label “Font,” etc. But I was able to configure these to have menu-item-like
actions…
Click on the “Font” label and the “bold” button is highlighted and a second
row appears to offer all the font-related options.
In essence, these buttons function like menu items. Only the top row shows
all the time, and clicking toggles the display of an extra row of related items.
When the “insert” button is clicked, all items on the top row that relate to
“insert” are highlighted, and the second row appears, displaying the
secondary “insert” buttons.
Even without these custom buttons, we should be tailoring the configuration
of buttons, each configuration tuned to a JCE profile (which is tied to a
Joomla user group). This allows us to show a limited number of buttons to
casual users and a larger set to power user.
/images/a

/docs/a
/video/a

/images
/docs
/video
Likewise, we can leverage JCE so that different user groups have different
root directories for managing their photos and other documents.
Going back to the county departments that I discussed earlier…
I leveraged this feature to give each department its own directory, isolating
their images and documents from other departments, and giving each
department a shorter list of items to navigate.
Are you aware that with JCE you can select a matrix of data cells and paste
them through the JCE editor so that they automatically are converted into
HTML tables? I created Word-like and Excel-like buttons that appear
prominently in the toolbar. They simply call the clipboard function directly.
The lesson: a custom button that replicates a common task can add
usability for our client.
Simplify and Tailor
Example:

Client interface for SEO consultant
Let‟s tailor a client interface for an example. This has happened to me more
than once: The client calls and asks me to give their new SEO consultant
access to the website.
I set up a new role: SEO Services. Then I create a admin module that
contains the links needed by this role.
I grant this role access to articles, but show only the fields that are relevant
to SEO.
Wow!
Joomla rocks!

I expect my client to be happy because the consultant can do his/her job.
I also expect the consultant to be happy with the simple interface (much
simpler than what he has experienced in other CMSs).
The new approach I‟m suggesting is to give the client an interface that is
separate from what we use to build the website. It can be simpler than the
default admin template, and it should be tailored to the client‟s needs.
But to do so does demand more from the site itegrators. It demands
assigning clients to a „client‟ template, possibly segmenting client users, and
using tools to configure the tailored experience.
Is the value worth the extra effort?
Let me provide evidence justifying the extra effort.
Your potential clients have a lot of options spanning CMSs and other vendors
that they can find on Google. They are comparing the options to their needs.
A study showed that companies weight a CMS based upon features and
usability. Companies that expect teams and/or non-technical users to use
the CMS quickly shift their decision making toward usability over features.
In short, the larger the client and their needs, the more likely they will
choose the vendor based upon usability of the CMS.

usability
features
During the client‟s comparison stage, your competition will be showing
screens like this as their touted “simple to edit” solution.
…or a screen like this…
…and maybe you will be competing against another vendor that says they
can offer Joomla. But they are likely to demo the traditional one-size-fits-all
solution. …
Meanwhile, you demo your easy-to-use solution. Tout it as tailored to the
client‟s needs so they will know to go back to the others to see how well the
others can match this. (of course, with the traditional approach, they can‟t )
Show them the intuitive dashboard and the streamlined workflow. Show
them a simple edit toolbar.
How do you plan to compete during evaluation? Are you really that much
better at design? Is your support or other offerings head-and-shoulders
above your competition?
But you can stand out in the one area that has proven frequently to be a
decisive factor –by delivering a very tailored interface in managing the
website.

usability
features
The notion of a client template demands we use new tools. But more than
that, it calls for a new discipline. Now that we can configure a client
experience, how do we do it well?
If you like this new approach… If you like the ideas I‟m
proposing… If you would like to get your early access to
the tools I‟m building…
Please visit iCueProject.com. And sign up to receive
updates.
The „Client‟ Template
- illustrated!

Randy Carey

iCueProject.com

More Related Content

Viewers also liked

Teknik sampling normalitas data statistika
Teknik sampling normalitas data statistikaTeknik sampling normalitas data statistika
Teknik sampling normalitas data statistika
Sylvester Saragih
 
Primero td presentation january 2015 final
Primero td presentation january 2015 finalPrimero td presentation january 2015 final
Primero td presentation january 2015 final
primero_mining
 
Rules and weather22
Rules and weather22Rules and weather22
Rules and weather22nmcquade
 
Nk neils kalnins
Nk neils kalninsNk neils kalnins
Nk neils kalninsegilsdo
 
Еремурус про екоосвіту_GreenDrinks 25.12.2012
Еремурус про екоосвіту_GreenDrinks 25.12.2012Еремурус про екоосвіту_GreenDrinks 25.12.2012
Еремурус про екоосвіту_GreenDrinks 25.12.2012
Oleksandra Shandra
 
Primero Mining 2013 Q1 Results
Primero Mining 2013 Q1 ResultsPrimero Mining 2013 Q1 Results
Primero Mining 2013 Q1 Results
primero_mining
 
Verb to be
Verb to beVerb to be
Verb to be
Lourdes Ruales
 
Eidn 1-introducao
Eidn 1-introducaoEidn 1-introducao
Eidn 1-introducao
liviacalmeida
 
Muscular endurance22
Muscular endurance22Muscular endurance22
Muscular endurance22nmcquade
 
Crawl, Walk, Run - Evolve Your Project Management in 2015!
Crawl, Walk, Run - Evolve Your Project Management in 2015!Crawl, Walk, Run - Evolve Your Project Management in 2015!
Crawl, Walk, Run - Evolve Your Project Management in 2015!
BrightWork
 
Primero q4 2014 presentation 2015 final
Primero q4 2014 presentation 2015 finalPrimero q4 2014 presentation 2015 final
Primero q4 2014 presentation 2015 final
primero_mining
 
Manajemen tambang materi 3
Manajemen tambang materi 3Manajemen tambang materi 3
Manajemen tambang materi 3
Sylvester Saragih
 
Uu tambang dan perburuhan materi 3
Uu tambang dan perburuhan materi 3Uu tambang dan perburuhan materi 3
Uu tambang dan perburuhan materi 3
Sylvester Saragih
 
Use grammar with pictures feb 8 2013 (1)
Use grammar with pictures  feb 8 2013 (1)Use grammar with pictures  feb 8 2013 (1)
Use grammar with pictures feb 8 2013 (1)
Telly J Hajny
 
A2 newspaper research
A2 newspaper researchA2 newspaper research
A2 newspaper research
debbie14
 
Primero Corporate Presentation December 2014
Primero Corporate Presentation December 2014Primero Corporate Presentation December 2014
Primero Corporate Presentation December 2014
primero_mining
 
Termodinamika 1dan termodinamika ii
Termodinamika 1dan termodinamika iiTermodinamika 1dan termodinamika ii
Termodinamika 1dan termodinamika ii
Sylvester Saragih
 
New members 10.14.15
New members 10.14.15New members 10.14.15
New members 10.14.15
TLMI
 

Viewers also liked (20)

Teknik sampling normalitas data statistika
Teknik sampling normalitas data statistikaTeknik sampling normalitas data statistika
Teknik sampling normalitas data statistika
 
Primero td presentation january 2015 final
Primero td presentation january 2015 finalPrimero td presentation january 2015 final
Primero td presentation january 2015 final
 
Test run
Test runTest run
Test run
 
Rules and weather22
Rules and weather22Rules and weather22
Rules and weather22
 
Nk neils kalnins
Nk neils kalninsNk neils kalnins
Nk neils kalnins
 
Еремурус про екоосвіту_GreenDrinks 25.12.2012
Еремурус про екоосвіту_GreenDrinks 25.12.2012Еремурус про екоосвіту_GreenDrinks 25.12.2012
Еремурус про екоосвіту_GreenDrinks 25.12.2012
 
Primero Mining 2013 Q1 Results
Primero Mining 2013 Q1 ResultsPrimero Mining 2013 Q1 Results
Primero Mining 2013 Q1 Results
 
Verb to be
Verb to beVerb to be
Verb to be
 
Eidn 1-introducao
Eidn 1-introducaoEidn 1-introducao
Eidn 1-introducao
 
Muscular endurance22
Muscular endurance22Muscular endurance22
Muscular endurance22
 
Crawl, Walk, Run - Evolve Your Project Management in 2015!
Crawl, Walk, Run - Evolve Your Project Management in 2015!Crawl, Walk, Run - Evolve Your Project Management in 2015!
Crawl, Walk, Run - Evolve Your Project Management in 2015!
 
Les restes
Les restesLes restes
Les restes
 
Primero q4 2014 presentation 2015 final
Primero q4 2014 presentation 2015 finalPrimero q4 2014 presentation 2015 final
Primero q4 2014 presentation 2015 final
 
Manajemen tambang materi 3
Manajemen tambang materi 3Manajemen tambang materi 3
Manajemen tambang materi 3
 
Uu tambang dan perburuhan materi 3
Uu tambang dan perburuhan materi 3Uu tambang dan perburuhan materi 3
Uu tambang dan perburuhan materi 3
 
Use grammar with pictures feb 8 2013 (1)
Use grammar with pictures  feb 8 2013 (1)Use grammar with pictures  feb 8 2013 (1)
Use grammar with pictures feb 8 2013 (1)
 
A2 newspaper research
A2 newspaper researchA2 newspaper research
A2 newspaper research
 
Primero Corporate Presentation December 2014
Primero Corporate Presentation December 2014Primero Corporate Presentation December 2014
Primero Corporate Presentation December 2014
 
Termodinamika 1dan termodinamika ii
Termodinamika 1dan termodinamika iiTermodinamika 1dan termodinamika ii
Termodinamika 1dan termodinamika ii
 
New members 10.14.15
New members 10.14.15New members 10.14.15
New members 10.14.15
 

Similar to The 'Client' Template - Illustrated!

HTML5 Up and Running
HTML5 Up and RunningHTML5 Up and Running
HTML5 Up and Running
Codemotion
 
Salesforce crm projects
Salesforce crm projects Salesforce crm projects
Salesforce crm projects
Advanz Knowledge Systems P Ltd
 
Topic in-et
Topic in-etTopic in-et
Topic in-et
TheWindChaser
 
ORACLE FUSION FINANCIAL CLOUD FEATURES - CREATING IMPLEMENTATION USERS
ORACLE FUSION FINANCIAL CLOUD FEATURES - CREATING IMPLEMENTATION USERSORACLE FUSION FINANCIAL CLOUD FEATURES - CREATING IMPLEMENTATION USERS
ORACLE FUSION FINANCIAL CLOUD FEATURES - CREATING IMPLEMENTATION USERS
IQ Online Training
 
dairy farm mgmt.pptx
dairy farm mgmt.pptxdairy farm mgmt.pptx
dairy farm mgmt.pptx
MusabInamdar2
 
Adesiyan Report on GUI effectiveness
Adesiyan Report on GUI effectivenessAdesiyan Report on GUI effectiveness
Adesiyan Report on GUI effectiveness
Jelilat Adesiyan
 
BMS-PPT-7viyvv.pptx
BMS-PPT-7viyvv.pptxBMS-PPT-7viyvv.pptx
BMS-PPT-7viyvv.pptx
sarahtucker61
 
Acknowledgement
AcknowledgementAcknowledgement
Acknowledgement
Rasim Izhar Ali
 
usability review
usability reviewusability review
usability review
Mauro Pellegrini
 
Embellish bureau
Embellish bureauEmbellish bureau
Embellish bureau
siraj10
 
AnswerModules - Supplier Invoice management
AnswerModules - Supplier Invoice managementAnswerModules - Supplier Invoice management
AnswerModules - Supplier Invoice management
AnswerModules
 
Website Specification Template V2 Feb 09
Website Specification Template V2 Feb 09Website Specification Template V2 Feb 09
Website Specification Template V2 Feb 09
JohnKeys
 
Medicine For World
Medicine For WorldMedicine For World
Medicine For World
Saifur Rahman
 
UXBASIS – Getting UX integrated
UXBASIS – Getting UX integratedUXBASIS – Getting UX integrated
UXBASIS – Getting UX integrated
James Kelway
 
Types, Features, and Examples of CMS for Web Development
Types, Features, and Examples of CMS for  Web DevelopmentTypes, Features, and Examples of CMS for  Web Development
Types, Features, and Examples of CMS for Web Development
company
 
Proposal this is cargo proposal designed
Proposal this is cargo proposal designedProposal this is cargo proposal designed
Proposal this is cargo proposal designed
ayazweb2
 
cahier des charges(1) (1).pdf du platform e-commerce
cahier des charges(1) (1).pdf du platform e-commercecahier des charges(1) (1).pdf du platform e-commerce
cahier des charges(1) (1).pdf du platform e-commerce
mohamedjawharchahed
 
The Art and Science of Requirements Gathering
The Art and Science of Requirements GatheringThe Art and Science of Requirements Gathering
The Art and Science of Requirements Gathering
Vanessa Turke
 
Summer23-Welly Release Highlights - Stephen Stanley.pdf
Summer23-Welly Release Highlights - Stephen Stanley.pdfSummer23-Welly Release Highlights - Stephen Stanley.pdf
Summer23-Welly Release Highlights - Stephen Stanley.pdf
Anna Loughnan Colquhoun
 
01 introduction to wad.pptx
01 introduction to wad.pptx01 introduction to wad.pptx
01 introduction to wad.pptx
chaituit2004
 

Similar to The 'Client' Template - Illustrated! (20)

HTML5 Up and Running
HTML5 Up and RunningHTML5 Up and Running
HTML5 Up and Running
 
Salesforce crm projects
Salesforce crm projects Salesforce crm projects
Salesforce crm projects
 
Topic in-et
Topic in-etTopic in-et
Topic in-et
 
ORACLE FUSION FINANCIAL CLOUD FEATURES - CREATING IMPLEMENTATION USERS
ORACLE FUSION FINANCIAL CLOUD FEATURES - CREATING IMPLEMENTATION USERSORACLE FUSION FINANCIAL CLOUD FEATURES - CREATING IMPLEMENTATION USERS
ORACLE FUSION FINANCIAL CLOUD FEATURES - CREATING IMPLEMENTATION USERS
 
dairy farm mgmt.pptx
dairy farm mgmt.pptxdairy farm mgmt.pptx
dairy farm mgmt.pptx
 
Adesiyan Report on GUI effectiveness
Adesiyan Report on GUI effectivenessAdesiyan Report on GUI effectiveness
Adesiyan Report on GUI effectiveness
 
BMS-PPT-7viyvv.pptx
BMS-PPT-7viyvv.pptxBMS-PPT-7viyvv.pptx
BMS-PPT-7viyvv.pptx
 
Acknowledgement
AcknowledgementAcknowledgement
Acknowledgement
 
usability review
usability reviewusability review
usability review
 
Embellish bureau
Embellish bureauEmbellish bureau
Embellish bureau
 
AnswerModules - Supplier Invoice management
AnswerModules - Supplier Invoice managementAnswerModules - Supplier Invoice management
AnswerModules - Supplier Invoice management
 
Website Specification Template V2 Feb 09
Website Specification Template V2 Feb 09Website Specification Template V2 Feb 09
Website Specification Template V2 Feb 09
 
Medicine For World
Medicine For WorldMedicine For World
Medicine For World
 
UXBASIS – Getting UX integrated
UXBASIS – Getting UX integratedUXBASIS – Getting UX integrated
UXBASIS – Getting UX integrated
 
Types, Features, and Examples of CMS for Web Development
Types, Features, and Examples of CMS for  Web DevelopmentTypes, Features, and Examples of CMS for  Web Development
Types, Features, and Examples of CMS for Web Development
 
Proposal this is cargo proposal designed
Proposal this is cargo proposal designedProposal this is cargo proposal designed
Proposal this is cargo proposal designed
 
cahier des charges(1) (1).pdf du platform e-commerce
cahier des charges(1) (1).pdf du platform e-commercecahier des charges(1) (1).pdf du platform e-commerce
cahier des charges(1) (1).pdf du platform e-commerce
 
The Art and Science of Requirements Gathering
The Art and Science of Requirements GatheringThe Art and Science of Requirements Gathering
The Art and Science of Requirements Gathering
 
Summer23-Welly Release Highlights - Stephen Stanley.pdf
Summer23-Welly Release Highlights - Stephen Stanley.pdfSummer23-Welly Release Highlights - Stephen Stanley.pdf
Summer23-Welly Release Highlights - Stephen Stanley.pdf
 
01 introduction to wad.pptx
01 introduction to wad.pptx01 introduction to wad.pptx
01 introduction to wad.pptx
 

More from Randy Carey

How Joomla! builds a webpage (annotated)
How Joomla! builds a webpage (annotated)How Joomla! builds a webpage (annotated)
How Joomla! builds a webpage (annotated)
Randy Carey
 
Site Migration and Content Strategy
Site Migration and Content StrategySite Migration and Content Strategy
Site Migration and Content Strategy
Randy Carey
 
Joomla Modules with Permissions and Front-End Editing
Joomla Modules with Permissions and Front-End EditingJoomla Modules with Permissions and Front-End Editing
Joomla Modules with Permissions and Front-End Editing
Randy Carey
 
Role Based ACL
Role Based ACLRole Based ACL
Role Based ACL
Randy Carey
 
Improving the Client's User Experience - JAB 2012
Improving the Client's User Experience - JAB 2012Improving the Client's User Experience - JAB 2012
Improving the Client's User Experience - JAB 2012
Randy Carey
 
Improving Joomla’s Backend User Experience
Improving Joomla’s Backend User ExperienceImproving Joomla’s Backend User Experience
Improving Joomla’s Backend User Experience
Randy Carey
 

More from Randy Carey (6)

How Joomla! builds a webpage (annotated)
How Joomla! builds a webpage (annotated)How Joomla! builds a webpage (annotated)
How Joomla! builds a webpage (annotated)
 
Site Migration and Content Strategy
Site Migration and Content StrategySite Migration and Content Strategy
Site Migration and Content Strategy
 
Joomla Modules with Permissions and Front-End Editing
Joomla Modules with Permissions and Front-End EditingJoomla Modules with Permissions and Front-End Editing
Joomla Modules with Permissions and Front-End Editing
 
Role Based ACL
Role Based ACLRole Based ACL
Role Based ACL
 
Improving the Client's User Experience - JAB 2012
Improving the Client's User Experience - JAB 2012Improving the Client's User Experience - JAB 2012
Improving the Client's User Experience - JAB 2012
 
Improving Joomla’s Backend User Experience
Improving Joomla’s Backend User ExperienceImproving Joomla’s Backend User Experience
Improving Joomla’s Backend User Experience
 

Recently uploaded

AWS Certified Solutions Architect Associate (SAA-C03)
AWS Certified Solutions Architect Associate (SAA-C03)AWS Certified Solutions Architect Associate (SAA-C03)
AWS Certified Solutions Architect Associate (SAA-C03)
HarpalGohil4
 
"NATO Hackathon Winner: AI-Powered Drug Search", Taras Kloba
"NATO Hackathon Winner: AI-Powered Drug Search",  Taras Kloba"NATO Hackathon Winner: AI-Powered Drug Search",  Taras Kloba
"NATO Hackathon Winner: AI-Powered Drug Search", Taras Kloba
Fwdays
 
Apps Break Data
Apps Break DataApps Break Data
Apps Break Data
Ivo Velitchkov
 
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge GraphGraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
Neo4j
 
GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)
Javier Junquera
 
QR Secure: A Hybrid Approach Using Machine Learning and Security Validation F...
QR Secure: A Hybrid Approach Using Machine Learning and Security Validation F...QR Secure: A Hybrid Approach Using Machine Learning and Security Validation F...
QR Secure: A Hybrid Approach Using Machine Learning and Security Validation F...
AlexanderRichford
 
Poznań ACE event - 19.06.2024 Team 24 Wrapup slidedeck
Poznań ACE event - 19.06.2024 Team 24 Wrapup slidedeckPoznań ACE event - 19.06.2024 Team 24 Wrapup slidedeck
Poznań ACE event - 19.06.2024 Team 24 Wrapup slidedeck
FilipTomaszewski5
 
"$10 thousand per minute of downtime: architecture, queues, streaming and fin...
"$10 thousand per minute of downtime: architecture, queues, streaming and fin..."$10 thousand per minute of downtime: architecture, queues, streaming and fin...
"$10 thousand per minute of downtime: architecture, queues, streaming and fin...
Fwdays
 
Mutation Testing for Task-Oriented Chatbots
Mutation Testing for Task-Oriented ChatbotsMutation Testing for Task-Oriented Chatbots
Mutation Testing for Task-Oriented Chatbots
Pablo Gómez Abajo
 
"Frontline Battles with DDoS: Best practices and Lessons Learned", Igor Ivaniuk
"Frontline Battles with DDoS: Best practices and Lessons Learned",  Igor Ivaniuk"Frontline Battles with DDoS: Best practices and Lessons Learned",  Igor Ivaniuk
"Frontline Battles with DDoS: Best practices and Lessons Learned", Igor Ivaniuk
Fwdays
 
PRODUCT LISTING OPTIMIZATION PRESENTATION.pptx
PRODUCT LISTING OPTIMIZATION PRESENTATION.pptxPRODUCT LISTING OPTIMIZATION PRESENTATION.pptx
PRODUCT LISTING OPTIMIZATION PRESENTATION.pptx
christinelarrosa
 
Leveraging the Graph for Clinical Trials and Standards
Leveraging the Graph for Clinical Trials and StandardsLeveraging the Graph for Clinical Trials and Standards
Leveraging the Graph for Clinical Trials and Standards
Neo4j
 
"What does it really mean for your system to be available, or how to define w...
"What does it really mean for your system to be available, or how to define w..."What does it really mean for your system to be available, or how to define w...
"What does it really mean for your system to be available, or how to define w...
Fwdays
 
What is an RPA CoE? Session 1 – CoE Vision
What is an RPA CoE?  Session 1 – CoE VisionWhat is an RPA CoE?  Session 1 – CoE Vision
What is an RPA CoE? Session 1 – CoE Vision
DianaGray10
 
Lee Barnes - Path to Becoming an Effective Test Automation Engineer.pdf
Lee Barnes - Path to Becoming an Effective Test Automation Engineer.pdfLee Barnes - Path to Becoming an Effective Test Automation Engineer.pdf
Lee Barnes - Path to Becoming an Effective Test Automation Engineer.pdf
leebarnesutopia
 
Dandelion Hashtable: beyond billion requests per second on a commodity server
Dandelion Hashtable: beyond billion requests per second on a commodity serverDandelion Hashtable: beyond billion requests per second on a commodity server
Dandelion Hashtable: beyond billion requests per second on a commodity server
Antonios Katsarakis
 
Discover the Unseen: Tailored Recommendation of Unwatched Content
Discover the Unseen: Tailored Recommendation of Unwatched ContentDiscover the Unseen: Tailored Recommendation of Unwatched Content
Discover the Unseen: Tailored Recommendation of Unwatched Content
ScyllaDB
 
ScyllaDB Tablets: Rethinking Replication
ScyllaDB Tablets: Rethinking ReplicationScyllaDB Tablets: Rethinking Replication
ScyllaDB Tablets: Rethinking Replication
ScyllaDB
 
Day 2 - Intro to UiPath Studio Fundamentals
Day 2 - Intro to UiPath Studio FundamentalsDay 2 - Intro to UiPath Studio Fundamentals
Day 2 - Intro to UiPath Studio Fundamentals
UiPathCommunity
 
The Microsoft 365 Migration Tutorial For Beginner.pptx
The Microsoft 365 Migration Tutorial For Beginner.pptxThe Microsoft 365 Migration Tutorial For Beginner.pptx
The Microsoft 365 Migration Tutorial For Beginner.pptx
operationspcvita
 

Recently uploaded (20)

AWS Certified Solutions Architect Associate (SAA-C03)
AWS Certified Solutions Architect Associate (SAA-C03)AWS Certified Solutions Architect Associate (SAA-C03)
AWS Certified Solutions Architect Associate (SAA-C03)
 
"NATO Hackathon Winner: AI-Powered Drug Search", Taras Kloba
"NATO Hackathon Winner: AI-Powered Drug Search",  Taras Kloba"NATO Hackathon Winner: AI-Powered Drug Search",  Taras Kloba
"NATO Hackathon Winner: AI-Powered Drug Search", Taras Kloba
 
Apps Break Data
Apps Break DataApps Break Data
Apps Break Data
 
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge GraphGraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
 
GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)
 
QR Secure: A Hybrid Approach Using Machine Learning and Security Validation F...
QR Secure: A Hybrid Approach Using Machine Learning and Security Validation F...QR Secure: A Hybrid Approach Using Machine Learning and Security Validation F...
QR Secure: A Hybrid Approach Using Machine Learning and Security Validation F...
 
Poznań ACE event - 19.06.2024 Team 24 Wrapup slidedeck
Poznań ACE event - 19.06.2024 Team 24 Wrapup slidedeckPoznań ACE event - 19.06.2024 Team 24 Wrapup slidedeck
Poznań ACE event - 19.06.2024 Team 24 Wrapup slidedeck
 
"$10 thousand per minute of downtime: architecture, queues, streaming and fin...
"$10 thousand per minute of downtime: architecture, queues, streaming and fin..."$10 thousand per minute of downtime: architecture, queues, streaming and fin...
"$10 thousand per minute of downtime: architecture, queues, streaming and fin...
 
Mutation Testing for Task-Oriented Chatbots
Mutation Testing for Task-Oriented ChatbotsMutation Testing for Task-Oriented Chatbots
Mutation Testing for Task-Oriented Chatbots
 
"Frontline Battles with DDoS: Best practices and Lessons Learned", Igor Ivaniuk
"Frontline Battles with DDoS: Best practices and Lessons Learned",  Igor Ivaniuk"Frontline Battles with DDoS: Best practices and Lessons Learned",  Igor Ivaniuk
"Frontline Battles with DDoS: Best practices and Lessons Learned", Igor Ivaniuk
 
PRODUCT LISTING OPTIMIZATION PRESENTATION.pptx
PRODUCT LISTING OPTIMIZATION PRESENTATION.pptxPRODUCT LISTING OPTIMIZATION PRESENTATION.pptx
PRODUCT LISTING OPTIMIZATION PRESENTATION.pptx
 
Leveraging the Graph for Clinical Trials and Standards
Leveraging the Graph for Clinical Trials and StandardsLeveraging the Graph for Clinical Trials and Standards
Leveraging the Graph for Clinical Trials and Standards
 
"What does it really mean for your system to be available, or how to define w...
"What does it really mean for your system to be available, or how to define w..."What does it really mean for your system to be available, or how to define w...
"What does it really mean for your system to be available, or how to define w...
 
What is an RPA CoE? Session 1 – CoE Vision
What is an RPA CoE?  Session 1 – CoE VisionWhat is an RPA CoE?  Session 1 – CoE Vision
What is an RPA CoE? Session 1 – CoE Vision
 
Lee Barnes - Path to Becoming an Effective Test Automation Engineer.pdf
Lee Barnes - Path to Becoming an Effective Test Automation Engineer.pdfLee Barnes - Path to Becoming an Effective Test Automation Engineer.pdf
Lee Barnes - Path to Becoming an Effective Test Automation Engineer.pdf
 
Dandelion Hashtable: beyond billion requests per second on a commodity server
Dandelion Hashtable: beyond billion requests per second on a commodity serverDandelion Hashtable: beyond billion requests per second on a commodity server
Dandelion Hashtable: beyond billion requests per second on a commodity server
 
Discover the Unseen: Tailored Recommendation of Unwatched Content
Discover the Unseen: Tailored Recommendation of Unwatched ContentDiscover the Unseen: Tailored Recommendation of Unwatched Content
Discover the Unseen: Tailored Recommendation of Unwatched Content
 
ScyllaDB Tablets: Rethinking Replication
ScyllaDB Tablets: Rethinking ReplicationScyllaDB Tablets: Rethinking Replication
ScyllaDB Tablets: Rethinking Replication
 
Day 2 - Intro to UiPath Studio Fundamentals
Day 2 - Intro to UiPath Studio FundamentalsDay 2 - Intro to UiPath Studio Fundamentals
Day 2 - Intro to UiPath Studio Fundamentals
 
The Microsoft 365 Migration Tutorial For Beginner.pptx
The Microsoft 365 Migration Tutorial For Beginner.pptxThe Microsoft 365 Migration Tutorial For Beginner.pptx
The Microsoft 365 Migration Tutorial For Beginner.pptx
 

The 'Client' Template - Illustrated!

  • 1. The „Client‟ Template - illustrated! Randy Carey iCueProject.com
  • 2. The “client” template is a new approach as to how the client maintains their website and web content …and a new demand as to what we as website developers build and deliver to the client.
  • 3. What is a client template? What does it look like? What value does it add? Why should I care?
  • 4. Note: This is a slightly modified version of the presentation given at the 2013 World Joomla Conference. Tailored to make the slides more meaningful as a non-live presentation, I am including summary text to each slide.
  • 5. A CMS, such as Joomla, provides to interfaces to the website: frontend and backend. The front-end caters to the needs of one audience – the public who comes to interact with the client‟s site.
  • 6. The backend is an interface to manage the website and its content. This single interface servers two audiences: [1] The website integrator architects and builds the site. This user leverages his/her expertise of the CMS and website architecture. [2] The “client” and staff manage the site‟s content over the lifetime of the site. This user-type leverages his/her domain expertise in the business.
  • 7. The CMS community often challenges itself… to improve the admin template. This challenge struggles with the natural tension: On one hand, by giving the site integrator a more powerful CMS the interface naturally grows more complex. Meanwhile, the needs of the client argue towards a simpler interface.
  • 8. So what things do we make simpler (shift to the right)? …and what things do we enrich (shift to the left)? Can we rebalance this tension so as to make the admin template better?
  • 9. Henry Ford, mass producer of the automobile, is rumored to have said… If I had asked people what they wanted, they would have said faster horses. This irony is that what his consumers thought they wanted was an improvement of the tool they had been using: horses. If they only had “faster horses.” But history proved that the consumer valued not the tool but what the tool delivered (transportation). The improvements that they really wanted was in that value (transportation) and most consumers would willingly discard the tool (horses).
  • 10. Returning to the challenge we tend to embrace “to improve the admin template” … I think we will never be satisfied with our results. The quest is based upon a “faster horses” type assumption (focusing on the current tool as the only option). Rephrase the question to what we really want “How can we improve our client’s ability to manage their website?” That new perspective allows us to accept a new approach…
  • 11. I suggest we find a breakthrough with this different approach: Give the client their own interface to managing the website (the „client‟ template). Stop making one interface (the traditional admin template) try to serve two different user types (admins vs clients).
  • 12. By providing the client with their own interface, we can deliver one that is simpler to user and tailored to the tasks that the client needs to perform.
  • 13. It is true that this approach adds to the role of the site integrator: This role not only designs and builds the front-end user experience – now this role is responsible for installing/configuring the new client experience. But this enables us to deliver to our clients a level of usability that adds significant value. This added value is something our clients want – and what our competitors are not offering.
  • 14. Simplify and Tailor What you are seeing is an example of the client interfaces that I have been delivering in Joomla 2.5. The two key words here are “simplify” and “tailor.” Because I deliver a „client‟ version to the backend, I can tailor the interface to the each client‟s needs. And that allows me to remove all the unneeded options and technical terms.
  • 15. Now I‟d like to show some backend interfaces that I have been delivering to my clients. FIRST, I will focus on the situations where the site is managed by a single person (in contrast to a team with segmented roles).
  • 16. This is for a Lawyer who provides services to businesses and non-profits. His main navigation is the “Quick Links” section near the top. Icons and short text provide a starting point to the common tasks he performs when logging in to his site: manage web content, newsletter content, newsletter campaign, and fee table. Because the single person is also the site owner, I provide admin modules that report site traffic as well as the MailChimp dashboard for his newsletter campaign results.
  • 17. This is for a registration site for electrician training classes. Again, the common tasks have been identified, and their starting points are available as a quick link: access to the various types of classes, registrations, event locations, page content, and job listings. Because the user is the site owner, the site statistics are shown.
  • 18. Notice that when the user clicks a link for a special type, she is brought to a particular listing pre-set to display only a particular category of classes. How do we do that? How do we create a link that sets filters on the resulting page?
  • 19. We can preset filters through the URL parameters – shown above in red. At the HTML level, each filter is represented as a filter with a name or id. And each option in the dropdown has a value. We can preset the filter by declaring the name of the input to be set to the value we want to set. We can even pre-set ordering and the search box.
  • 20. ?option=com_modules&task=module.edit&id=17 And by using a pattern as shown above we can create a link that takes one directly to the edited screen for a particular module. This can be very helpful is there is one or a few modules that our client regularly wants to update directly.
  • 21. Examples: …where the site is managed by a team of users, and their responsibilities are segmented.
  • 22. Client is a theater production company. Here are two differing views, each displaying a different role. The upperleft is for the content manager who maintains page content. The lowerright is for the ticket manager who manages ticket sales/pricing as well as transaction data. Note that each role gets a simple view of what it needs to access, and nothing more (not even site reports).
  • 23. Client: a county (government) with over 20 departments and divisions. Each department has its own role, and each role will see a set of quick links like you see here – each set tuned to give access to the resources just for that department.
  • 24. Here are the user groups that represent a department. For each checked group, that user will be given that role‟s set of quick links. Typically, each department has access just to its own set of quick links.
  • 25. Of course, there are some within the organization that need access to other aspects of the site. In this example, the user has been assigned to the roles (user groups) of calendar management, employment section, and announcement. Notice that I chose not to give these users any menu item other than a link back to the dashboard. By returning to the dashboard, a user returns to all the options, grouped neatly as shown here.
  • 26. In sites with segmented user roles, most roles include just a short set of quick links. However, I usually need to create a “webmaster” role that grants access to menu items and reporting.
  • 27. And in reality, the person assigned to webmaster is often assigned to additional roles. So the webmaster role has access to menu and reporting items, and each additional role provides an additional set of quick links.
  • 28. One large site had five languages, so I replicated all sets of quick links for each language. And as I showed earlier, each link that led to a list also preset the language filter. (Yes, this did take a lot of extra configuration work, but the client had the need to segment by language, and Joomla allowed me to provide that.)
  • 29. The client interfaces that I‟ve shown are using the Mission Control admin template. But this template reached its end-of-life in Joomla 2.5. I could not find a 3.x admin template that allowed me to provide as simple of a client view as I could in 2.5. So… I have built my own prototype.
  • 30. Keynote at Drupalcon 2013 Karen McGrane This community is so well positioned to tackle this problem. You have a powerful, flexible framework. And you have access to real users so you can prototype and test new interfaces. You are designing the user experience for the content creators. Start thinking like a UX designer, start thinking like a content strategist, and invent the future. Well-known information strategist, Karen McGrane, discussed this issue at a recent Drupalcon. Quoted here is her concluding paragraph, and I found it to resonate with the approach of the iCue Project… Build prototypes and test to see what works.
  • 31. By being forced to build from scratch, I found myself able to take the concept of „client‟ template further. I no longer simply wished for a feature – I tried to build what I thought a client template should have. What I‟m showing next are screenshots of my 3.x prototypes. These are currently being reworked into installable extensions to be made available through iCueProject.com
  • 32. First, let‟s review the features found on Isis, the default admin template of 3.1. It contains a menu bar of hard-coded menu items. The content area (outlined here in red) includes a sidebar menu that can‟t be changed and a list of quick links that is set to always include about a dozen items. Additional admin modules are included by default, but can be removed through the module manager
  • 33. This is not a blank screen. It is my client template out-of-the-box. I took an extreme minimalist approach with my client template. When it is installed, it is like a black page awaiting for the site integrator to specify which admin templates are to be added to it. The only things provided initially are a link back to the dashboard, a link to view the front-end of the site, and a dropdown for the user to change his/her account or to log out. Those are the only things I felt were needed universally.
  • 34. My client template does not include the 3.x set of assumptions and modules for the admin‟s “home page.” In contrast, this version provides several module positions that can be used for arranging all sorts of admin modules: quicklinks, reports, campaign dashboards, etc.
  • 35. Of course, we have to add navigation. The client template assumes that the site integrator will use a tool to create and assign these
  • 36. But since we now have control of creating navigation, and since we have isolated the client‟s interface, …we ought to tailor navigation to the client. [1] That means using terms that the client is familiar with. [2] It also means identifying the most common tasks for this user and organizing the navigation around those tasks and not according to the logical organization we developers have come to expect. For example, instead of articles and categories, we might use “page content,” “services,” “testimonials,” and ”announcements.” Don‟t under value or overlook the IA (information architecture) that we should tailor to our clients.
  • 37. I found myself needing to build the tool for creating dashboard icons. Again, the burden of having to build my own afforded me the ability to think about what more things I should be adding and then do so. This is the current version of the edit screen for Client Links. I do recognize other ought-to-haves and plan to add them, such as a wizard that allows you to generate a URL that presets filters on a given form.
  • 38. Last year I wrote this article for the Joomla magazine that suggested we give our clients their own menu in the backend using the IA and terms relevant to the client. Because the admin template is hard-coded, the solution then was to override the layout file. NOW, since my client template does not include the default admin menu bar, I created a tool for creating and tailoring a client menu bar.
  • 39. Here you can see the client menu bar added to the dashboard.
  • 40. Since we are now responsible for the client template‟s navigation, we need to pay attention to IA and navigation issues. For instance, is it wise to use both a menu and quicklinks. If we use both, how can we vary the two so that the combination adds value without being redundant. My preferred approach is to use just quick links and require a user to finish working within a component and hit the “dashboard” button before he/she can jump to another component or task. Of course, power users probably want both, and I do accommodate.
  • 41. backend templates Admin template Client template By this point it is obvious that my 3.x prototype is no longer an “admin” template. The result arguably is a new type of backend template - a “client” template that is distinct from the admin template in terms of its features and assumptions.
  • 43. Up to this point I have been focusing on the admin “home” page, or “dashboard” page. The client template must also handle lists views and edit forms as supplied by the component.
  • 44. I modeled the layout after what I‟ve been delivering in 2.5 with the Mission Control template. I did run into limitations in that 3.x delivers the ordering of parts (subnavigation, filters, search, list) in a fixed bundle – so I had to work within some imposed coding. List view
  • 45. Here is an edit screen for an article just as we get it from the component. Notice all fields are displayed whether they are needed or not.
  • 46. Another article that I wrote last year was on simplifying and tailoring the edit screens to our client‟s needs. In this example we see the edit screen for a product in a store. The tailored version removes unused fields, shifts important fields to the main tab, and adds styling to the field labels to denote if a field is required, important, or ignorable. simplify & tailor edit screens
  • 47. Here is a tailored version of an article edit screen. The “title” field is red to denote required. Some fields are read only (category, status). Many fields are not needed, so they are not displayed.
  • 48. I was able to create a tool that allows the site integrator to create multiple versions of admin edit screens – for any given field we can declare it to be hidden, read-only, of a certain importance level, and the default value. So instead of overriding a layout file, the changes are made through a configuration screen.
  • 49. Here is the result of the “Article Options” tab when set to show only four fields of the twenty-some that are shown by default.
  • 50. Here is an example of a minimized version of the Contact form. On the main tab the fields are Name, Linked User, Information and Tags. Category, Language, Published and other fields are preset to default values and not even shown.
  • 51. The “Contact Details” fields is reduced to just those fields that are needed (the list tailored to the client‟s needs).
  • 52. The other tabs are all blank because we‟ve tailored those fields to be hidden in this version. I do plan to return to this to see if I can find a way to hide tabs that have no content.
  • 53. Tailor JCE Although technically not part of the template, I think the editing toolbar is an important feature that ought also be simplified and tailored as needed. You might not have notice, but what is shown here is the result of some JCE buttons that I created and added. Originally my custom buttons were meant to be labels to help group the toolbar buttons. Note that “bold” is under the label “Font,” etc. But I was able to configure these to have menu-item-like actions…
  • 54. Click on the “Font” label and the “bold” button is highlighted and a second row appears to offer all the font-related options. In essence, these buttons function like menu items. Only the top row shows all the time, and clicking toggles the display of an extra row of related items.
  • 55. When the “insert” button is clicked, all items on the top row that relate to “insert” are highlighted, and the second row appears, displaying the secondary “insert” buttons.
  • 56. Even without these custom buttons, we should be tailoring the configuration of buttons, each configuration tuned to a JCE profile (which is tied to a Joomla user group). This allows us to show a limited number of buttons to casual users and a larger set to power user.
  • 57. /images/a /docs/a /video/a /images /docs /video Likewise, we can leverage JCE so that different user groups have different root directories for managing their photos and other documents. Going back to the county departments that I discussed earlier… I leveraged this feature to give each department its own directory, isolating their images and documents from other departments, and giving each department a shorter list of items to navigate.
  • 58. Are you aware that with JCE you can select a matrix of data cells and paste them through the JCE editor so that they automatically are converted into HTML tables? I created Word-like and Excel-like buttons that appear prominently in the toolbar. They simply call the clipboard function directly. The lesson: a custom button that replicates a common task can add usability for our client.
  • 60. Example: Client interface for SEO consultant Let‟s tailor a client interface for an example. This has happened to me more than once: The client calls and asks me to give their new SEO consultant access to the website.
  • 61. I set up a new role: SEO Services. Then I create a admin module that contains the links needed by this role.
  • 62. I grant this role access to articles, but show only the fields that are relevant to SEO.
  • 63.
  • 64.
  • 65.
  • 66. Wow! Joomla rocks! I expect my client to be happy because the consultant can do his/her job. I also expect the consultant to be happy with the simple interface (much simpler than what he has experienced in other CMSs).
  • 67. The new approach I‟m suggesting is to give the client an interface that is separate from what we use to build the website. It can be simpler than the default admin template, and it should be tailored to the client‟s needs.
  • 68. But to do so does demand more from the site itegrators. It demands assigning clients to a „client‟ template, possibly segmenting client users, and using tools to configure the tailored experience. Is the value worth the extra effort? Let me provide evidence justifying the extra effort.
  • 69. Your potential clients have a lot of options spanning CMSs and other vendors that they can find on Google. They are comparing the options to their needs.
  • 70. A study showed that companies weight a CMS based upon features and usability. Companies that expect teams and/or non-technical users to use the CMS quickly shift their decision making toward usability over features. In short, the larger the client and their needs, the more likely they will choose the vendor based upon usability of the CMS. usability features
  • 71. During the client‟s comparison stage, your competition will be showing screens like this as their touted “simple to edit” solution.
  • 72. …or a screen like this…
  • 73. …and maybe you will be competing against another vendor that says they can offer Joomla. But they are likely to demo the traditional one-size-fits-all solution. …
  • 74. Meanwhile, you demo your easy-to-use solution. Tout it as tailored to the client‟s needs so they will know to go back to the others to see how well the others can match this. (of course, with the traditional approach, they can‟t )
  • 75. Show them the intuitive dashboard and the streamlined workflow. Show them a simple edit toolbar.
  • 76. How do you plan to compete during evaluation? Are you really that much better at design? Is your support or other offerings head-and-shoulders above your competition? But you can stand out in the one area that has proven frequently to be a decisive factor –by delivering a very tailored interface in managing the website. usability features
  • 77. The notion of a client template demands we use new tools. But more than that, it calls for a new discipline. Now that we can configure a client experience, how do we do it well?
  • 78. If you like this new approach… If you like the ideas I‟m proposing… If you would like to get your early access to the tools I‟m building… Please visit iCueProject.com. And sign up to receive updates.
  • 79. The „Client‟ Template - illustrated! Randy Carey iCueProject.com

Editor's Notes

  1. A story…
  2. A story…
  3. A story…
  4. Let’s use this as a model. We recognize Joomla as being divided into two parts – front-end that displays the site to the public, and the backend for building and managing the site.
  5. In the traditional approach, the integrator uses the backend to build the site. And the same backend is handed off to the client for maintain the site’s content. So the same backend serves two different user types.
  6. This leads to a tension between the two needs (builder and client). And with a felt need to make the backend more usable, we keep hearing suggestions for improving the backend – for improving the admin template. But in which direction shall we go to make the admin template better? To desirable goals are at odds with each other: more features, and easy of use. When we move in one direction, we compromise the other. What is the best balance? In what direction do we move to make a better admin template?How do we make a better admin template?
  7. This leads to a tension between the two needs (builder and client). And with a felt need to make the backend more usable, we keep hearing suggestions for improving the backend – for improving the admin template. But in which direction shall we go to make the admin template better? To desirable goals are at odds with each other: more features, and easy of use. When we move in one direction, we compromise the other. What is the best balance? In what direction do we move to make a better admin template?How do we make a better admin template?
  8. So we return to the question: How do we make a better admin template? But whatever answer we get to this question will not satisfy us. The question is based upon a “faster horses” assumption. It is a question we should not be asking.Instead, we should asking: How can improve the ability of the client to manage his website and web content? And when we shift to this question , we can find an answer that satisfies us…
  9. I want to point out where I found my work… With Mission Control (Joomla 2.5) I took a minimized admin template and tailored it to serve the client. I reality, it differed from the admin template in how it was used, But as I prototyped my own template in 3.x, I reached a point that I was using something distinct from the admin template – my evolved version of the “client” template was no longer a version of the admin template – rather it evolved into a sibling to the admin version.Both are backend templates, but the client template refuses to take on many of the features that are inherent in the admin template – the hard-coded admin menu, the preset set of quicklinks and other admin modules. Unlike the admin template that assume every CMS feature must be accessible somehow through it, The client template assumes nothing and starts with virtually a blank page – prepared to take on only those details we specifically add to it.
  10. The admin template serves the needs and expertise of the Joomla expert, providing access to all the features of the Joomla CMS.The client template serves the client’s interest in the site, providing a typically short list of tasks that are well understood by the client.
  11. Summary: simplified and tailored dashboard, navigation, edit forms, editor (JCE)
  12. Summary: simplified and tailored dashboard, navigation, edit forms, editor (JCE)