rippey-icon-rippey-5-0
Rippey 5.0 Guide - Employees
/
...
/
4.1 Screen Layout
Share
Explore
rippey-icon-rippey-5-0
Rippey 5.0 Guide - Employees

icon picker
4.1 Screen Layout

The Processing screen is divided into two sections: Sidebar and Transaction Wrapper.
⁠
image.png
Documents > Processing
⁠
⁠

Sidebar

The Sidebar is positioned on the left side of the screen and is designed to be hid-able, allowing users to maximize the space dedicated to the Transaction Wrapper for an enhanced user experience.
⁠
image.png
Inbox View
⁠
⁠

Sidebar - Inbox View

Row 1

Within the Sidebar, the first row features two things: All Emails dropdown and Chevron-Left icon.
⁠
image.png
Row 1 in Sidebar
⁠
⁠
The All Emails dropdown offers users various options that determine the contents of the Transaction List below. These options include transactions assigned to the user, custom queues or groups of transactions created by the user, and all emails/ transactions. ​
image.png
All Emails Dropdown
⁠
⁠
The Chevron-Left icon closes the sidebar. When the sidebar is closed, it is replaced by Chevron-Right icon which opens the sidebar again.

Row 2

In the Sidebar, the second row consists of tabs similar to the one in Overview page with two options: Inbox and Files. The Inbox tab shows list of all the emails sent to the dashboard or the documents uploaded there. The Files tab shows the list of files attached to the email selected in the Inbox tab. These tabs are linked to the ones in the Overview page in order to make the interaction between these pages more in sync which is explained further in detail at the end of this page.
⁠
image.png
Second row in Sidebar
⁠
⁠

Row 3

In the Sidebar, the third row offers essential tools for streamlined navigation and data refinement: a Mail icon, an Upload icon, a Search icon and a Filter icon.
⁠
image.png
Third row in Sidebar
⁠
⁠
The Mail button allows user to refresh the Inbox to check if any new mails have been received.
The Upload icon is used to upload a new document in the dashboard.
The Search icon opens the search box which allows user to search for transactions and documents in the similar manner as it does in our old dashboard.
The Filter dropdown is similar to the one on our Overview page. Unlike the old dashboard's filter, this one offers many more options. Users can choose from a wide range of filters to customize their transaction views, making sure they get exactly what they need from the system.
⁠
image.png
Filter dropdown
⁠
⁠

Row 4

In the Sidebar, the fourth row introduces a convenient feature: quick filters for Transaction Statuses. It will show the number of Success, Need Review and Failed/ Error transactions present in the list.
⁠
image.png
Fourth Row in the Sidebar
⁠
⁠
Each Status filter is interactive, allowing users to refine their view with a single click. By leveraging this functionality, users can effortlessly focus on transactions of interest, enhancing efficiency and productivity. Only one filter can be applied at one time.

Inbox List

After this section comes the Inbox List. The Inbox List shows all transactions with detailed information. Unlike the sidebar present in our old dashboard, this new design offers much more data per transaction.
⁠
image.png
Transaction Card
⁠
⁠
Each transaction card includes:
Transaction Name
Review Status(Yellow Shield → Not Reviewed/ Green Shield → Reviewed)
SLA countdown
Time Received/ Start Time
Sender’s Email Address
Date Received
Email Subject
Transaction Status(Success/ Error/ Need Review/ Failed/ Success With Exception)
Execution Status(Executed/ In Progress/ In Queue) [Only for POD Clients]
Number of Documents Attached
Execution Count

info
Things to Remember:
Email subject can take maximum two rows of space. If the name of the Email Subject is longer, then ellipsis [...] will be used to hide the remaining subject name.
If the Sidebar is set to Assigned To Me, then the list will only be containing transactions that have not been reviewed. As the user processes the transactions and sets the Review Status to Reviewed, the transaction will disappear from the list. This is only in the case where the Sidebar is based on transactions that has been set to Assigned To Me.
The attachments button inside each sidebar is clickable. It will take the users to the Files view and show the Files of the email selected in the Inbox view.

Pagination

At the end of the Sidebar, we have the pagination for users to navigate through various pages.
⁠
image.png
Pagination
⁠
⁠

Sidebar - Files View

When you switch to the Files tab or click on the attachments present inside a transaction card, the contents of Sidebar switches to a view where you can see all the details of the selected transaction. It also lists out any attachments related to that transaction.
⁠
image.png
Files View in Processing Sidebar
⁠
⁠

Row 1

Within the Sidebar, the first row features two things: All Emails dropdown and Chevron-Left icon.
⁠
image.png
Row 1 in Sidebar
⁠
⁠
The All Emails dropdown offers users various options that determine the contents of the Transaction List below. These options include transactions assigned to the user, custom queues or groups of transactions created by the user, and all emails/ transactions. When a user switches to another transaction list from this dropdown, then the Files view will change to Inbox showing the transactions that belongs to that selection. ​
image.png
All Emails Dropdown
⁠
⁠
The Chevron-Left icon closes the sidebar. When the sidebar is closed, it is replaced by Chevron-Right icon which opens the sidebar again.

Row 2

The second row has the Inbox and Files tab with Files as the active tab.
⁠
image.png
Row 2 in Sidebar
⁠
⁠

Row 3

In the Sidebar, the third row offers more essential tools : a Back icon, an Download icon, a Zip icon and a Search icon.
⁠
image.png
Row 3 in Sidebar
⁠
⁠
The Back icon takes user back to the Inbox list.
The Download icon downloads all the documents inside the email as separate files.
The Zip icon downloads all documents inside the email as a single zip folder.
The Search icon opens the search box which allows user to search for transactions and documents in the similar manner as it does in our old dashboard.

Transaction Card

The series of icons in third row is followed by the same transaction card present in the Inbox view of the email selected. This ensures that users receive comprehensive transaction details, as outlined in the explanation of the transaction card above.
⁠
image.png
Transaction Card in Sidebar
⁠
⁠

Documents List

Then we have a section which will be showing the list of documents attached to that transaction.
⁠
image.png
Document List before Split
⁠
⁠

⁠
image.png
Document List after Split
⁠
⁠
Each document card will contain following information about the documents:
Document count of the file. It will simply increase with the number of documents like Document 1, Document 2 and so on.
Download Icon to download the document.
The Document Name/ File Name can take maximum of two lines. If it exceeds two lines, then ellipsis [...] will be used to hide the remaining file name.
The full form of the Document Type will be present inside a badge along with the Review Status of that document.
info
Note: The list of documents differs based on the state the User is in. If the user is in a state that comes before the Split state, the list will contain the list of original attachments. The Document Type and Review Status will not be shown. But the states after the split state will have split files shown in the list along with their document type and review status shown.
Lastly, we have an accordion which shows the major Details regarding that transaction. The Transaction Details include the following information about the selected transaction:
Client Name
Branch Name [Branching will be coming in the future versions of the dashboard]
Sender Email Address
Subject Name
Time Received
Start Time/ End Time [If the transaction has not been processed yet, show Start Time]
Processing Time
Execution Count
Transaction Status
Execution Status [Only for POD customers]
Review Status

⁠
image.png
Transaction Details
⁠
⁠

Transaction Wrapper

The Transaction Wrapper is where the actual Production Monitoring will take place. Based on which transaction has been selected in the Sidebar, the Transaction Wrapper will show the processing details accordingly.
⁠
image.png
Transaction Wrapper
⁠
⁠

Transaction Header

The first row in this section is a Transaction Header which consists of all the transaction level actions that a user can take. It consist of series of buttons and actions that user can take on transaction level.
⁠
image.png
⁠
⁠
The details on each component present in this header is explained below from left-to-right.
Left-Side Actions:
aThe Left Arrow button is to switch to previous transaction in the queue. This button will remain disabled if the user is in first transaction.
The text area shows the Sequence of Transaction. It indicates that the queue of transactions consists of 10 transaction and the user is in seventh one.
The Email Subject will show the subject of the transaction that the user is in. This will be in dropdown form inside where the user can see and change the logs of the transaction as well as Archive the transaction itself. The logs will also show the name of the user who had last executed the transaction.
⁠
image.png
Email Subject Dropdown
⁠
⁠
Right-Side Actions:
The Re-Execute icon will re-execute the flow from currently active state onwards.
The Refresh icon will refresh the workflow step they’re in to view the changes they have saved.
The Menu icon will open a dropdown with various layout option which will allow users to set the layout of the Processing page as they prefer.
⁠
image.png
Layout Options
⁠
⁠
The options that the dropdown provides are:
Fullscreen: This will remove the browser tabs and other stuffs.
Navigation: This will hide the Primary and Secondary Navigation of the dashboard.
Sidebar: This will hide the Email List at the side of the screen.
The Category will allow user to categorize the transaction on what error they have as well as add a remark for clearer explanation and resolution.
⁠
image.png
Category Dropdown
⁠
⁠
The Review/Not Reviewed button is clickable which will change the status of the transaction from Reviewed → Not Reviewed and vice versa.
The Right Arrow button is to switch to next transaction in the queue. This button will remain disabled if the user is in last transaction.

Workflow Steps

Then we have the Workflow Steps.
Extract Email
Split Document
Extract Data Template
Create Payload
Send Success/ Error Email
⁠
image.png
Workflow Steps
⁠
⁠

Workflow Step Contents

After the Workflow Steps, we have the contents that come under each step. Each of these step show different content for the transaction flow.
Details of each workflow step and how it functions is present in the next page.

Dashboard Interaction

info
Initiate processing from Overview / Inbox
User selects Email from Inbox in Overview > Lands in Processing > Sidebar shows Inbox and selected Email is highlighted. Capture Data State shows the first File inside the selected Email.
If a user has applied a filter to the Inbox view in Overview and clicked on a transaction, then they’ll be directed to that transaction in the Processing page with that filter already applied to the list.
Initiate processing from Overview / Document-Level
User selects File from Files in Overview > Lands in Processing > Sidebar active tab is Files and selected File is highlighted. Capture Data State shows the selected File.
If a user applies a filter to the document-level view and clicks on a document, then they’ll be directed to that transaction that has the document selected. But the filter will not be applied to the list in Processing page.
Back to Overview link
The Back to Overview link present in the secondary navigation will allow user to go back to the exact transaction they had selected from the Overview regardless of the page and position of the transaction before being directed to the Processing page.
Let’s take a use case. In Overview page, a user clicks on a transaction that is present in 5th page on 6th row. The user will be directed to that transaction in the same position in the Processing page and when the click on the Back to Overview link from there, they’ll be directed to the Overview page on 5th page with the 6th row highlighted.

⁠

⁠
← Processing [Documents]
⁠
⁠


⁠
Workflow Steps →
⁠
⁠



Sidebar
Sidebar - Inbox View
Row 1
Row 2
Row 3
Row 4
Inbox List
Pagination
Sidebar - Files View
Row 1
Row 2
Row 3
Transaction Card
Documents List
Transaction Wrapper
Transaction Header
Workflow Steps
Workflow Step Contents
Dashboard Interaction
← Processing [Documents]
Workflow Steps →
Gallery
Share
 
Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.