Upload
others
View
1
Download
0
Embed Size (px)
Citation preview
Persona:
Story:
ABC Company sells computers and its accessories. They also have a return policy within 30 days of selling any
products, but at the time of returning that product sales person of ABC company, needs approval from his/her Branch
Manager in case returned amount is more than 50,000 INR.
Whenever a customer came with his/her products in showroom to return the product, first of all sales person checks
the condition of the product, whenever all terms and condition gets fulfilled for return, then the sales person creates a
Return Order Claims (which is custom document in SAP) with reference to the billing document and also attaches the
scan copy of billing document/invoice with the ROC (Return Order Claim), so that it can be checked/verified during
approval and also for future audit purposes. If the returned amount exceeded 50,000 INR, it requires approval from
branch manager. The approval workflow gets triggered the moment ROC gets created in the system. If the return
amount is less than 50,000 INR, automatically return order gets created at the time of ROC creation, no approval
required for that case.
This approval has incorporated using Fiori master details approval applications. At the time of approval, a return order
gets created with reference to ROC number automatically in the background. Then only sales person can continue with
subsequent sales processes (i.e. return delivery, post goods receipt and credit memo creation) for that document. So
the return process is not possible without the approval of branch manager, if amount is more than 50,000 INR.
• Address customer and employee satisfaction issues promptly
• Adhere to high ethical standards, and comply with all regulations/applicable
laws
• Network to improve the presence and reputation of the branch and company
• Stay abreast of competing markets and provide reports on market movement
and penetration are proactive, involved in the community and with their
customers, and don’t wait for business to walk through the door.
• Customers
• Team Leads of Sales Persons
• Branch Accountants
• Other Brach Mangers
• Zonal Manager
Improve decision making during
approval process so that it
improves the efficiency and
effectiveness of ABC Company.
Branch Manager for
Kolkata branch in ABC Company
Mr. Amit Seal
• Direct all operational aspects including distribution operations, customer service, human resources,
administration and sales
• Assess local market conditions and identify current and
prospective sales opportunities
• Develop forecasts, financial objectives and business plans
• Bring out the best of branch’s personnel by providing training, coaching, development and motivation
• Locate areas of improvement and propose corrective actions that meet challenges and leverage growth opportunities.
42 Years old: Married: Master of Business
Administration: 17 Years of Work Experience: Manages Kolkata branch of ABC Company with 40
stuffs under him: Lots of travelling: Good
Communication skills
• Meet goals and metrics
• Manage budget and allocate funds appropriately
• Share knowledge with other branches and headquarters on
effective practices, competitive intelligence, business opportunities
and needs
• I needed real time insight of sales process
• Get things done quickly since I am on the move all the time,
dealing with million things.
• I need to analyze all required details (like Customer return
history and product return history) at the time of any decision making.
2
User Journey:
Current User Experience Journey Duration of the Journey: 20 mins
POV:
User Needs a way to Surprisingly/Because/But/So that
Amit Seal, Branch
Manager
Quickly approve or reject ROC Because he is on the move all the time, dealing with
million things.
Amit Seal, Branch
Manager
Access return history of customer
and product both during decision
making.
So that he can analyze all required details at the
time of any decision making.
Mock Up: Please check the mock up in following link:
https://standard.experiencesplash.com:443/api/projects/98141821db36de5a0babf118/prototype/snapshot/latest/inde
x.html#/1458118160420_S0
SAP Web Ide App Prototype:
Developing the App in SAP Web IDE:
1. Object Attribute & Object Status in Header View: These will allow to add additional details in master list in
header view:
2. Object Attribute & Object Status in Details View: These will allow to add additional details in details view
object header section:
Mindset
Actions
Touch Points
One more return from
customer of more
than 50,000 INR!
Why customer is
returning?
Need to check original
invoice, for details of
all products sold to
customer!
What is the condition of
returned items?
Is the customer
returning all products
or few of them only?
What is the history of the
customer, is he returning
very frequently
Are these few common
products getting returned
by multiple customers?
Should I reject the
request?
Ok, I will approve this.
Check the Return
Order Claim (ROC) number
Check list of ROCs and total amount for that
customer
Check corresponding
invoice details. Check all returned
products details
Approve the return
Return Order Claim
(ROC) number
Invoice
Number Customer Return History
History of return
products
Sales Person Mobile Device Returned
Amount
Check return history
of the product.
3
3. Icon Tab Bar, Icon Filter & SAP Icons in Details View: Icon tab bar is used to show multiple tabs in details view,
different SAP Icons selected for four different icon tab filters, also icon color can be different for different tabs:
4. Simple Form, Label, Text & Object Number for Header Tab in Details View: These UI elements used for
displaying structure level data, “ObjectNumber” UI element used for displaying amount or quantity fields where
you can add unit in same UI element. Date format also used here to show proper date.
5. Table with Row Selection & Navigation Property in Item Tab of Details View: In the details view xml file table
has defined with row pressing event named “onItemPressed”. Also column popin properties used so that table
gets changed in mobile view with small screen size:
This on press event has handled in details view controller with navigation property, here we are passing material
number of selected line from the item table:
4
The corresponding router related information has modified in “manifest.json” file in “routes” and “target” section,
we also define the data needs to be passed during the call using routes, say for example in this case we are passing
material number (property name: Matnr):
6. Navigation Back from Material History View: In the view xml file page tag view navigation has activated also an
event has defined.
After that in view controller corresponding event has handled so that it can navigate back to previous view:
7. Column Chart in VizFrame for Material History View: This is new UI5 view created for displaying history, in
the view xml file’s content section first VizFrame UI element defined:
After that data binding, measure and dimension definition done in corresponding view controller:
8. Hyperlink in Table Cell in Attachment Tab: In the attachment table a column Link UI element used so that
when approver click on the file, corresponding location of that file (available in OData property) will open:
5
9. Table Cell Coloring Conditionally in Customer History Tab: It can be achieved using state property of object
number, here we have set the value of state based on returned amount:
10. Fragment to Display Popup, Text Area & Dropdown Select: Here two fragments have used for two popups,
approve and reject. Both the fragment views and their contents are shown in SAP Web IDE layout editor:
11. Buttons: Here two buttons defined in footer toolbar of detail view xml file (Approve and Reject), one is of type
accept and another is of type Reject:
Also corresponding on “press” events of those two buttons have handled in view controller, here we are calling
corresponding fragment for popup:
6
12. Message Toast & Message Box: Here message toast used to display after approve and reject:
In case of rejection, if approver does not select Rejection Reason from the dropdown we are showing message
using message box:
Testing the App with Mock Data in SAP Web IDE:
At first configuration created to run the app using mock data:
After running the app with mock data, following screen will appear. By default first record from the header set will be
selected. In details section, there are four tab and by default header tab will be selected:
Button
Icon Tab Bar
& Icons
Object Attribute
Object Status
Simple Form,
Label, Text,
Object Number
7
Following screen will appear when Items tab is selected, approver can check return history of all materials pressing the
navigation button in item line:
After pressing navigation button from second line item, a new view will open with return history of second material (i.e.
Printer 364647) for last 12 months. Data will be displayed in VizFrame Column Chart. For going back to item details view,
use “Back” navigation button.
In the Attachments tab approver can access all documents and images attached with the ROC claim no, if user clicks on the
file name it will open the link where actually file is stored:
In the last tab, approver can check return history of customer. In this table, if the returned amount is more than 50,000
INR (i.e. required Branch Manager Approval), then that amount will be marked as red, otherwise the amount is marked as
green:
Table with
Navigation Property
Navigation
Back Button
VizFrame
Column Chart
Hyperlink
property with
table cell
8
At the end when approver press “Approve” button, a final popup will appear for optional comments from approver along
with Ok & Cancel buttons:
After pressing Ok button, it will show message using Message Toast:
In case approver, press the “Reject” button, along with an optional comment a drop down will appear with some Rejection
Reason:
Cell Coloring
Conditionally in
Table
Fragment to
Display Popup
Text Area to
write comments
during approval
Buttons in Popup
Message Toast
Select for
dropdown purpose
9
This Rejection Reason is mandatory, in case approver tries to reject without providing any Rejection Reason, it will throw
a message and stop the rejection process:
Also all three tables are responsive and table popin properties have used, so that table gets changes in mobile device.
When we change the device from SAP Web IDE we can check the behavior:
Message Box for
message display