HTML5 Interface - cobweb.businesscollaborator.com 6.4 HTML5 Interface... · The HTML5 interface is Business Collaborator’s next generation user experience that is designed to deliver

This user guide is for the HTML5 interface in BC 6.4.

1 Introduction

The HTML5 interface is Business Collaborator’s next generation user experience that is designed to deliver three key

benefits:

1 A simplified view onto the documents and data stored on Business Collaborator

2 A responsive interface that works on desktops, laptops, tablets and phones

3 A configurable interface that can present information in new ways to users

1.1 Focus

With BC 6.4 we are delivering version 1.0 of the HTML5 interface that is focussed on enabling:

Browsing and searching for information

Uploading and tagging documents

Tracking and responding to workflow

Providing an improved experience when using tablets

At present there is no support for the creation of workflow, project administration, user administration, schema

administration or system administration in the HTML5 interface. For users who need access to this functionality an

“Open in ‘Full’ Interface” option is available from the user menu.

2 The basics

A view of documents and their metadata in a project can be seen below in the HTML5 interface:

HTML5 Interface

User Guide 15 December 2015

Version 1.0 | BC-27919001

HTML5 Interface | User Guide

www.groupbc.com 15 December 2015 | Version 1.0 | BC-27919001 2

There are many similarities between the HTML5 interface and Graphite interface so much of your knowledge should

transfer across nicely. This document will focus on the key elements and the major differences.

2.1 How to get to the HTML5 interface?

If you are using a mobile device (e.g. a smartphone or a tablet) you will automatically be taken to the HTML5

interface.

If you are using a laptop of desktop you can manually switch to the HTML5 interface from “Settings | Edit Preferences”

action in the top bar. You will be able to choose “HTML5” from the “User Interface” drop down.

2.2 Key interface elements

2.2.1 Top bar

Clicking on the logo in the top left will take you back to your home.

The search form allows you to search:

Current location (supports whole word matching and KLANG across all metadata fields)



Whole system (supports whole word matching and KLANG across all metadata fields)

Projects (supports partial matching)

The user menu allows you to:

View your details

Edit your details

Edit your preferences

Change password

Open in “Full” interface

Log Out

2.2.2 Dashboards

To open the “Dashboard” or the “Project Dashboard”, click on the text or the down chevron - “v” - and they will slide

into view.

In your home you will see the system dashboard which shows:



Your tasks across the system

Your recent projects

Your recent documents

In a project you will see the project dashboard which shows:

Your tasks across the project

Your recent project documents

A project information panel

2.2.3 Location bar

Shows you the path to your current location. Use this to navigate back towards your home.

2.2.4 Toolbar

The toolbar groups together the following actions that apply to your current view or selected items.

Add – add documents, discussions, folders, etc. to the current location

Actions – a combination of actions for the current location (More Info, Edit Metadata, Paste, etc.) and actions

for currently selected items (Edit Type, Edit Metadata, Cut, Copy, Delete)

Refresh – updates your current view to include the most recently added items

Navigate up – navigate into the parent container

Navigation – access to the waste bin (deleted items) and bag (cut or copied items)

Cut, Copy, Paste, Download and Delete – quick access to these common actions



Drop files here – drag and drop documents onto this element to upload many documents at once

2.2.5 Listing headings

Sort by column headings to see information in the order you need it.

2.2.6 Filter bar

The filter menu contains the following actions:

Apply filters

Show all

Clear values

In a collection you also see:

Show Documents/Issues toggle

Show all versions/latest versions/current versions

Use the filter bar to find documents and information when there are many hundreds or thousands of items in the

current location.

2.2.7 New and updated

If the “Events” column is showing in the container you may see “New” and “Updated” labels.

New – an item has been newly created – e.g. a new document or a new document revision in a collection

Updated – an item has been updated – e.g. a document has had its metadata edited or a new document

revision in a folder

These labels only show if the event occurred in the last 7 days.



2.2.8 Item menu

Each item has its own menu that allows you to, amongst other things:

More Info

Edit Type

Edit Metadata

Revise

View with BIM Viewer

The actions available will depend upon the object and your permissions.

2.2.9 Pagination bar

Navigate between pages of data and documents.

2.2.10 Document modal

Clicking on a document opens the document modal, which presents:

The file size and last modified (date)

Secure link – with email link shortcut

Public link – (if available) with email link shortcut



Download action – proceed to download the file

Info action – quick access to the more information page

2.3 Adding documents

To add documents, drag and drop your files onto the “Drop Files Here” area in the toolbar:

Once the upload has completed you should see a success dialog:

Once uploaded you should be prompted to edit the type of each document (in BC this is controlled by the Processes

setting which is configured for the area you are in by the administrators and managers):

Once the types have been chosen, click on “Save Types and Edit Metadata” to set the metadata of the documents

you have just uploaded:



If all values for a field should be the same, set the top one and click the “Copy Down” (black down arrow) to copy that

value into all documents.

Once completed, click “Save” to apply the metadata to the documents.

2.4 Responding to workflow (issues)

You are also able to immediately respond to tasks against documents from a listing:

Or you can locate an issue and respond from its view by clicking on the “Respond” button:



You can also respond to workflow directly from your email client by clicking on the “Respond” button if you have

received a workflow notification.

The Actions menu enables you to carry out some (depending upon your permissions and issue configuration on the

current project) of the following actions:

Add Discussion

Cancel Issue

Complete Issue

Find Current Documents

Find Issued Documents

Remind Users

Respond to Issue.



From the respond to issue page you are then able to make your response:

You can save all responses as a draft at any time by clicking on “Save All as Draft”.

To submit your responses, ensure you check the “Select” box for the response and click “Submit Selected”.



You can expand the “Details” and “Responses” sections to see more information about the issue and the responses

that have already been made. Here is an example of an expanded details section:

Note that the HTML5 interface presents a view which is focussed on the person who has to make a response. This is

a subset of the information shown in the Full BC interface. (You can view the current issue in the Full interface by

clicking on “Open in ‘Full’ Interface” from the user menu.)

2.5 Video

A video tutorial for the HTML5 interface is available here:

https://youtu.be/22iRq2dSFjc

3 Top tips

1 Quickly get to a location you have recently worked in by clicking on the arrow to the right of a document in the

“Dashboard | My Recent Documents” panel.

2 Need to do something only supported in the “Full” Graphite interface? Quickly switch to that interface from the

user menu and choose “Open in ‘Full’ interface…”.

3 Selecting many documents at once and clicking “Download” (in the toolbar) will get you a ZIP file of the

selected documents.

4 Migrating from Graphite

The following tips should help people switching from Graphite:

1 The menu bar and fast track bar have been merged into a single, all powerful toolbar.

https://youtu.be/22iRq2dSFjc



2 The “View/Change” and “Selected” menus have been merged into a single “Actions” menu in the toolbar.

3 The “Object” menu (on a document, folder, project, etc.) has moved from between the object icon and object

name to the left of the object icon.

4 Key actions from the “Filter” tab in a collection are now found in the “Filter” spilt menu for a listing.

5 Searching for a project has moved from the “My Projects” panel in the sidebar to the “Search” split menu in the

top bar.

6 Clicking on a document doesn’t immediately open it, instead you get a popup that lets you understand how

large the file is before you download it. (You are still able to right click the document and save/download the

file directly to your computer.)

7 You are not able to select items across many pages of listings in the HTML5 interface, although you are still

able to select up to 25 items from a single page.

5 Configuration options

The HTML5 interface supports a wide array of configuration options. Here are some of them in action:

A full configuration guide can be found here:

https://cobweb.businesscollaborator.com/pub/english.cgi/0/27892459?op=lp

https://cobweb.businesscollaborator.com/pub/english.cgi/0/27892459?op=lp