App Center User Experience Guidelines fr Apps fr Me
TABLE OF CONTENTS A WORD ON ACCESSIBILITY...3 DESIGN GUIDELINES...3 Accunt Linking Prcess... 3 Cnnect... 5 Accept Terms... 6 Landing Page... 6 Verificatin... 6 Sign In r Sign Up... 7 Cnfirmatin... 7 GUIDELINE CHECKLIST...7 ACCESSIBILITY BEST-PRACTICES...8 Prvide text alternatives... 8 Distinguishable cntent... 8 Keybard cntrl... 9 Predictable structure... 9 Input assistance... 9 App Center User Experience Guidelines fr Apps fr Me Revised 04/2018 Page 2 f 10
Welcme t the SAP Cncur App Center! We are very excited t partner with yur cmpany. In this guide, we will help yu streamline the prcess f cnnecting a user s SAP Cncur accunt t yur system. Yu will find best practices fr usercentered design, examples f ds-and-dn ts, and suggested steps t guide the user thrugh the cnnectin prcess. It is nt ur intentin t tell yu what clrs and fnts t use. Maintaining yur brand integrity is imprtant, and these guielines d nt interfere with that. Rather, ur gal is fr SAP Cncur user t have a pleasant and cnsistent experience acrss all f ur partner applicatins. Observing these guidelines will help ensure that ur shared users have psitive experiences with bth f ur cmpanies as a result f ur partnership. A WORD ON ACCESSIBILITY This guide als includes sme suggestins n hw t ensure yur site is Sectin 508 cmpliant. At SAP Cncur, we wrk hard t make sure ur critical services are available and usable by every emplyee at the cmpanies wh use ur prducts. Frm private cmpanies t gvernment agencies, we have a wide range f users with varying levels f abilities. Observing accessibility best practices in yur prduct helps us meet ur cmmitment t prvide quality sftware t ur entire user base. DESIGN GUIDELINES This guide includes requirements and recmmendatins fr yur App Center partnership with SAP Cncur. These guidelines will allw yu t integrate SAP Cncur s user-centered design apprach int the end user s experience, creating a seamless integratin. Required elements are essential, and recmmended elements are ptinal but useful fr creating a cmprehensive integratin with Cncur. Accunt Linking Prcess This sectin prvides guidelines fr the prcess fr an end-user (cnsumer) t cnnect their SAP Cncur accunt with yur applicatin. Nte that nt all steps belw will apply t all applicatins. This guide, hwever, attempts t cver the cmmn variatins. The cnnectin flw begins frm the SAP Cncur App Center. Once the user has accepted the terms f the cnnectin, the user will be redirected t yur site. <Cntinued n next page> App Center User Experience Guidelines fr Apps fr Me Revised 04/2018 Page 3 f 10
Step 1 Cnnect Step 2 Accept Terms Step 3 Landing Page Step 4 Accunt Creatin Step 5 Cnfirmatin App Center User Experience Guidelines fr Apps fr Me Revised 04/2018 Page 4 f 10
Cnnect There are tw pssible cnfiguratins fr cnsumer listings: 1. Cnnect. This applies t App Center partners and TripLink suppliers withut lyalty accunts. This cnfiguratin and flw is depicted abve. 2. Cnnectin Request which applies t TripLink suppliers with lyalty accunts. Fr mre infrmatin n this flw, please refer t the TripLink supplier guide. App Center User Experience Guidelines fr Apps fr Me Revised 04/2018 Page 5 f 10
Accept Terms The user accepts the SAP Cncur Terms & Cnditins. These terms apply t the use f the SAP Cncur App Center and data sharing. Landing Page This will be the first page the user sees upn redirect frm SAP Cncur t yur applicatin. The SAP Cncur App Center will pen a new windw t yur pre-defined redirect URI (referred t as yur Cnnect URI ). This page shuld include yur brand and the applicatin the custmer is cnnecting t. In additin, the page shuld clearly indicate that the custmer is activating an integratin with SAP Cncur. The first page shuld give the user the ptin t sign in with an existing accunt r sign up fr a new accunt. This page shuld: Clearly indicate the integratin with SAP Cncur in text Include links t yur terms and cnditins and privacy plicy Include links t yur supprt and help ptins Sign Up T facilitate ease f use and encurage users t cmplete registratin, it is recmmended that this page nly include necessary infrmatin t create the accunt. Accunt details can be pre-ppulated in this frm leveraging SAP Cncur API s. Fr mre infrmatin, please refer t dcumentatin n the Develper Prtal. Once the user submits the frm, yur applicatin will begin the authenticatin prcess. Yur Partner Enablement representative will prvide the technical details fr implementatin based n yur SAP Cncur integratin type. 6
If yur accunt creatin prcess requires multiple steps, prvide a prgress indicatr s the user knws what is required. If the frm requires infrmatin the user may nt have, allw the user t cme back and cmplete the frm at a later time and prceed with accunt creatin. Cnfirmatin Once the cnnectin is cmplete, indicate that the cnnectin was successful. IMPORTANT: Users shuld be directed t clse the windw as the cnnectin is cmplete. Additinally, yu may decide t display links fr the user t yur app s hme page. Nte: If yu prvide links t yur hme page, it is recmmended that links pen a new brwser windw t clearly indicate that the cnnectin was successfully cmpleted and t display yur page in a larger frm factr. GUIDELINE CHECKLIST This sectin prvides a summarized checklist f the required and recmmended cmpnents f yur accunt linking flw. Fr mre detail, please refer t Design Guidelines sectin abve. Step Guidelines Must indicates required. Recmmendatins are prvided fr an ptimal user experience. Landing Page(s) All pages Must supprt a frm factr f 800x600 (required) Must prvide back/frward navigatin, where applicable. (required) Shuld be Sectin 508 Cmpliance (strngly recmmended) Shuld include supprt and help ptins clearly thrughut the App Center User Experience Guidelines fr Apps fr Me Revised 04/2018 Page 7 f 10
Step Guidelines Must indicates required. Recmmendatins are prvided fr an ptimal user experience. prcess. Must supprt majr brwsers and versins. The full list f Cncursupprted brwsers is available here. (required) Shuld adhere t yur cmpany s brand and marketing guidelines Must include yur cmpany branding and specific applicatin brand, if applicable (required) On the first page (at a minimum), Must clearly indicate this is an integratin with Cncur (required) Shuld include links t yur terms and cnditins and privacy plicy (strngly recmmended) Accunt Creatin Shuld include a prgress indicatr (recmmended) Cnfirmatin Page Must have an indicatin that the cnnectin was successful. (required) Must prvide next steps. (required) Discnnect Users shuld be prvided with a methd t discnnect within yur prtal. Please see dcumentatin fr revking a tken n the Develper Prtal. (strngly recmmended) ACCESSIBILITY BEST-PRACTICES Prvide text alternatives Prviding text alternatives fr nn-text cntent ensures that individuals with visual impairment are still able t understand yur site r applicatin. SAP Cncur recmmends prviding shrt text alternatives fr images, which makes yur image cntent nearly as accessible as yur text-based cntent. This allws special technlgy such as screen readers (which assist the blind) t read yur cntent alud t a user with visual disabilities. Distinguishable cntent SAP Cncur s design fcuses n making it easy fr users t see and/r hear cntent. SAP Cncur manages this challenge by: App Center User Experience Guidelines fr Apps fr Me Revised 04/2018 Page 8 f 10
Clearly separating fregrund frm backgrund Making sure clr is nt used as the nly visual means f cnveying infrmatin, indicating an actin, prmpting a respnse r distinguishing a visual element Using readable fnts, making sure any text is at least 14 pints and has gd cntrast (a minimum f 4.5 t 1 clr cntrast between the text and backgrund clr is recmmended) Prviding a highly visible highlighting mechanism fr links r cntrls when they receive keybard fcus These design elements help make the user experience better fr all users, but especially thse wh are visually impaired r clr-blind. Keybard cntrl All functinality f yur site r applicatin shuld be perable thrugh a keybard interface withut requiring specific timings fr individual keystrkes. Prviding keybard input mechanisms helps users with visual impairments r mbility issues t use yur site withut having t pint-and-click n bjects they cannt see. The keybard interface can be cmbined with muse input r ther input methds, t supprt all users. Predictable structure SAP Cncur s design attempts t make all pages appear and perate in predictable ways. SAP Cncur manages this challenge by: Psitining labels clearly and in clse prximity t inputs Using cnsistent navigatin patterns acrss a set f webpages Input assistance SAP Cncur aims t help users avid and crrect mistakes by: Hiding ptinal frm fields Validating frm submissins n the server Re-displaying a frm with a summary f errrs, if necessary Prviding errr ntificatins as the user enters infrmatin, including errr ntificatin infrmatin in the page title Highlighting r visually emphasizing errrs where they ccur Fr further infrmatin n accessibility fr yu and yur team, we recmmend: http://www.w3.rg/wai/guid-tech http://www.w3.rg/wai/wcag20/quickref/ http://webaccessibility.jhu.edu/what-is-accessibility/imprtant.html App Center User Experience Guidelines fr Apps fr Me Revised 04/2018 Page 9 f 10
www.sap.cm/cntactsap 2018 SAP SE r an SAP affiliate cmpany. All rights reserved. N part f this publicatin may be reprduced r transmitted in any frm r fr any purpse withut the express permissin f SAP SE r an SAP affiliate cmpany. The infrmatin cntained herein may be changed withut prir ntice. Sme sftware prducts marketed by SAP SE and its distributrs cntain prprietary sftware cmpnents f ther sftware vendrs. Natinal prduct specificatins may vary. These materials are prvided by SAP SE r an SAP affiliate cmpany fr infrmatinal purpses nly, withut representatin r warranty f any kind, and SAP r its affiliated cmpanies shall nt be liable fr errrs r missins with respect t the materials. The nly warranties fr SAP r SAP affiliate cmpany prducts and services are thse that are set frth in the express warranty statements accmpanying such prducts and services, if any. Nthing herein shuld be cnstrued as cnstituting an additinal warranty. In particular, SAP SE r its affiliated cmpanies have n bligatin t pursue any curse f business utlined in this dcument r any related presentatin, r t develp r release any functinality mentined therein. This dcument, r any related presentatin, and SAP SE s r its affiliated cmpanies strategy and pssible future develpments, prducts, and/r platfrm directins and functinality are all subject t change and may be changed by SAP SE r its affiliated cmpanies at any time fr any reasn withut ntice. The infrmatin in this dcument is nt a cmmitment, prmise, r legal bligatin t deliver any material, cde, r functinality. All frward-lking statements are subject t varius risks and uncertainties that culd cause actual results t differ materially frm expectatins. Readers are cautined nt t place undue reliance n these frward-lking statements, and they shuld nt be relied upn in making purchasing decisins. SAP and ther SAP prducts and services mentined herein as well as their respective lgs are trademarks r registered trademarks f SAP SE (r an SAP affiliate cmpany) in Germany and ther cuntries. All ther prduct and service names mentined are the trademarks f their respective cmpanies. See http://www.sap.cm/crprate-en/legal/cpyright/index.epx fr additinal trademark infrmatin and ntices.