openSAP

Building Mobile Applications with SAP Screen

Personas
This transcript was created using machine translation to provide learners on openSAP with more free options
for using the learning content. It is possible that the translation contains parts that are incorrect, so we also
have the original English transcript for you that was written by professional translators.

Week 1 Unit 1

00:00:07 Bonjour et bienvenue à la semaine une, unité un, de notre cours openSAP, création
d'applications mobiles avec SAP Screen Personas. Je suis Sebastian Steinhauer et je suis
vice-président de l'équipe d'ingénierie de l'expérience utilisateur SAP responsable de SAP

00:00:20 Screen Personas. Tout au long de ce cours, vous allez apprendre à utiliser SAP Screen
Personas et le moteur Slipstream pour créer et déployer rapidement
00:00:28 et facilement des applications mobiles à faible code. Bien que SAP Screen Personas et le
moteur mobile fonctionnent correctement sur les périphériques de bureau, nous ne nous

00:00:36 focaliserons que sur l'aspect mobile. Pour une meilleure compréhension de SAP Screen
Personas, je vous encourage à consulter nos autres cours openSAP.
00:00:47 Après avoir pris cette formation, vous devriez être en mesure d'utiliser SAP Screen
Personas et son éditeur de variante pour créer des applications mobiles destinées aux cas
d'utilisation spécifiques à votre entreprise, qui sont prêtes à rendre sur vos terminaux
00:01:00 mobiles à l'aide du moteur mobile, notre moteur de rendu SAPUI5. L'article dans ce cours
cible plusieurs rôles différents :
00:01:07 les analystes d'entreprise, les développeurs, les architectes d'entreprise et les concepteurs.
Nous aborderons différents aspects liés à chacun des rôles.
00:01:14 Par exemple, en tant qu'architecte, vous allez apprendre comment fonctionne SAP Screen
Personas. En tant que développeur, vous verrez comment écrire des scripts qui accèdent
aux fonctionnalités de terminal native lors de l'exécution
00:01:24 dans le client Fiori. En tant que concepteur, vous allez obtenir des informations précieuses
sur la conception de la variante des terminaux mobiles.
00:01:31 En tant qu'analyste de gestion, vous apprendrez à créer des variantes et à exécuter
correctement les projets SAP Screen Personas.
00:01:38 Contrairement aux cours openSAP précédents de SAP Screen Personas, cette formation
suivra un projet mobile simple des exigences de l'utilisateur initial à la réussite du
déploiement, et aborde la plupart des fonctionnalités et des développements les plus
récents
00:01:52 dans SAP Screen Personas et le moteur Slipstream. Nous poursuivrons la semaine une fois
avec l'introduction au moteur mobile et la planification d'un projet mobile.
00:02:00 Au cours de la semaine 2, nous allons nous concentrer sur la manière de ventiler les
scénarios complexes pour les terminaux mobiles, en particulier les biens immobiliers et les
performances des réseaux mobiles.
00:02:09 Au cours de la semaine trois, nous verrons comment déployer le scénario SAP Mobile
Sales vers vos utilisateurs finaux. Avec cette présentation de niveau supérieur de ce cours,
voyons ce que vous allez apprendre cette semaine.
00:02:21 Aujourd'hui, nous parlons de plates-formes de développement à faible rotation. Dans l'unité
suivante, nous vous fournirons une solide compréhension du moteur Slipstream comme la
technologie de base utilisée dans ce
00:02:31 cours. Dans l'unité trois, nous allons aborder le scénario qui guide la formation et comment
apprendre les interactions des utilisateurs
00:02:38 finaux au début du processus de développement. L'unité quatre vous présentera les
principes de conception de l'application mobile.
00:02:44 Et dans l'unité cinq, nous allons commencer à utiliser SAP Screen Personas pour concevoir
l'application mobile. À ce stade, j'ai mentionné à peu près le terme "peu de code".

00:02:56 Il est temps que nous nous assurions la même compréhension. Les plates-formes de
développement à bas de code vous permettent de créer des applications principalement via
l'interaction et la
00:03:06 configuration graphiques, au lieu des langages de programmation traditionnels. Alors que le
concept n'est pas nouveau, le terme "faible code" a commencé à se produire autour de
2014.
00:03:15 Il est important de noter que le terme "faible code" est très prudent pour indiquer que ces
plateformes diminuent, mais qu'il n'est pas nécessaire d'éliminer la nécessité d'un codage
mobile.
00:03:27 L'idée fondamentale d'une plate-forme de développement à faible code est qu'un éventail
plus large de personnes peuvent contribuer activement au développement d'applications et
que leur public cible n'est pas limité aux développeurs formels.
00:03:40 Des plates-formes de développement de faible codage ont émergé pour permettre la
création et le déploiement rapides des applications qui peuvent répondre aux besoins
spécifiques d'une organisation commerciale, tout en optimisant le processus de
développement de
00:03:52 logiciels. SAP Screen Personas avec le moteur Slipstream est une plate-forme à bas de
gamme conçue spécialement pour créer des applications mobiles
00:04:01 en plus des fonctionnalités SAP existantes. Elle vous permet de prendre une transaction
SAP classique comme point de départ et de créer rapidement une application mobile.
00:04:12 Cela s'effectue en supprimant les éléments inutiles, en ajoutant de nouveaux éléments et
en utilisant un "ce que vous voyez est l'éditeur" pour créer une expérience mobile.
00:04:21 Nous fournissons également un environnement de script intégré et convivial, ainsi que
plusieurs outils pour garantir un déploiement en douceur dans votre entreprise.
00:04:31 Comme vous le voyez, nous avons conçu SAP Screen Personas pour combiner la flexibilité
d'un environnement de programmation graphique convivial avec la richesse fonctionnelle de
SAP pour combler le fossé entre les solutions rapides requises par les
00:04:43 organisations commerciales et la nécessité d'un système centralisé d'enregistrement avec
une mise à disposition et un déploiement contrôlés.
00:04:51 Aujourd'hui, nous avons parlé de la structure générale du cours et des différents publics
cibles pour SAP Screen Personas en tant que plateforme de développement à bas niveau.
00:05:00 Dans l'unité suivante, Tobias Queck, notre Chief Architect, couvrira le fonctionnement
interne du moteur Slipstream et pourquoi elle est une source de départ fondamentale de
l'approche SAP classique du rendu de dynpro.
00:05:12 J'espère que vous apprécierez le reste de ce cours. C'est un grand jour.

2
Week 1 Unit 2

00:00:07 Bonjour et bienvenue à la semaine one, unité deux, de notre cours openSAP, création
d'applications mobiles avec SAP Screen Personas. Mon nom est Tobias Queck et je suis le
Chief Architect responsable de SAP Screen Personas et du moteur Slipstream.
00:00:20 La dernière fois, Sebastien a introduit le cours et aujourd'hui, nous parlerons de
l'architecture du moteur Slipstream. Nous nous concentrerons sur la flexibilité ajoutée dans
les variantes de consommation, ainsi que sur la maintenance simplifiée.
00:00:32 Avant d'entrer dans l'architecture du moteur Slipstream, voyons rapidement le
fonctionnement interne de SAP Screen Personas lorsqu'il est utilisé avec SAP GUI pour
HTML.
00:00:42 Au niveau supérieur, vous disposez de trois couches côté serveur. En haut, vous avez les
applications de gestion qui ne sont pas affectées.
00:00:47 La couche suivante, votre SAP S/4HANA ou SAP NetWeaver, est où SAP Screen Personas
est installé en tant qu'add-on et interagit avec les composantes centrales de l'exécution du
programme ABAP.
00:00:58 L'add-on contient uniquement la logique backend mais également les sources client qui
sont exécutées lors de l'utilisation des fonctionnalités Personas côté client.
00:01:05 En tant que couche inférieure, vous avez le noyau SAP NetWeaver contenant Internet
Transaction Server, ITS. L'ITS est responsable de la génération de l'HTML représentant les
écrans transactionnels, ainsi que de l'application de vos
00:01:17 modifications définies dans les variantes SAP Screen Personas. Et, bien entendu, pour
consommer une variante, un navigateur de bureau pris en charge est requis pour vos
utilisateurs finaux.
00:01:27 Du point de vue de la gestion, la principale modification architecturale consiste à utiliser les
bibliothèques SAPUI5 pour le moteur Slipstream, ce qui nous permet de soutenir les
ordinateurs de bureau ainsi que les navigateurs mobiles.
00:01:38 Les fichiers basés sur SAPUI5 requis pour le rendu de vos écrans sont regroupés avec les
sources SAP Screen Personas existantes, de sorte que vous puissiez, en tant que client,
obtenir la version la plus récente et la plus élevée comme faisant partie de la note
00:01:50 client SAP Screen Personas. Il n'est donc plus nécessaire de mettre à jour le noyau pour
les corrections du moteur de rendu.
00:01:57 Nous sommes également passés d'un rendu côté serveur à un rendu pur côté côté client et
à l'application de variantes, en simplifiant encore davantage les exigences et les
dépendances.
00:02:07 Enfin, moins de données doivent être échangées entre le frontend et le backend, car le
backend ne envoie pas les écrans entièrement affichés mais uniquement le modèle de
données requis pour le rendu de ces écrans.
00:02:17 Cette approche a un impact positif sur les performances et est similaire à la communication
entre le backend et la SAP GUI pour Windows.
00:02:24 Indépendamment du moteur Slipstream, les variantes SAP Screen Personas fonctionnent
toujours avec les GUI classiques et vous devez toujours sélectionner le canal de
consommation correspondant à vos besoins.
00:02:34 Il existe des scénarios dans lesquels SAP GUI, même avec un ensemble de fonctionnalités
limité, est le meilleur choix. Dans d'autres cas, une expérience utilisateur homogène doit
être fournie à l'aide de la barre de lancement SAP Fiori.
00:02:45 Bien que le moteur Slipstream ait été développé avec l'attention sur les terminaux mobiles,
il s'agit également d'une alternative aux navigateurs de bureau.
00:02:53 En particulier lors de l'utilisation de la barre de lancement SAP Fiori, le moteur Slipstream
est une option intéressante car elle est fournie comme une application SAP Fiori et peut
donc être intégrée à votre barre de lancement.

3
00:03:04 En outre, nous fournissons un plug-in de barre de lancement, rendant l'intégration plus
simple et plus simple. Comme précédemment mentionné, notre objectif était et est de
fournir un moteur de rendu qui vous permet de mobiliser vos transactions
00:03:17 SAP. Le moteur Slipstream vous permet d'exécuter des transactions SAP dans des
navigateurs mobiles, mais aussi d'accéder aux
00:03:24 fonctionnalités natives de l'appareil, telles que l'appareil photo, lorsqu'elles sont utilisées
conjointement avec le client SAP Fiori. La livraison d'un accès mobile à votre transaction
SAP nécessite non seulement un support pour les terminaux mobiles, mais aussi la
00:03:37 possibilité d'accéder à vos écrans depuis Internet. Par conséquent, nous avons veillé à ce
que vous puissiez exposer le plug-in du Slipstream à l'aide de SAP Web Dispatcher ou en
00:03:47 combinaison avec SAP Cloud Platform et le connecteur SAP Cloud. Donc, d'un point de
vue architectural, il n'y a rien qui vous empêche de mobiliser vos transactions SAP.
00:03:56 Dans cette unité, vous obtenez une vue d'ensemble des changements d'architecture
introduits par le moteur mobile. Nous vous avons montré comment elle réduit l'effort de
maintenance tout en vous permettant d'utiliser vos variantes où, quand et
00:04:08 comment vous en avez besoin. Ensuite, nous aborderons la planification de votre projet
d'application mobile.
00:04:14 Merci.

4
Week 1 Unit 3

00:00:07 Bonjour et bienvenue à la semaine one, unité trois, de notre cours openSAP, Création
d'applications mobiles Building Applications mobiles avec SAP Screen Personas.
00:00:17 Mon nom est Sylvia Barnard. La dernière fois, nous voulions vous donner une
compréhension de l'architecture qui sous-tend le moteur Slipstream :
00:00:26 où les choses sont stockées, traitées, etc. Aujourd'hui, nous allons nous concentrer sur la
planification de votre application mobile.
00:00:36 Les clients, votre gestionnaire de processus de gestion ou vos utilisateurs peuvent vous
venir et demander une application mobile pour une transaction SAP GUI développée pour
usage du bureau, sans avoir une idée claire de ce qui signifie ou de savoir exactement ce
qu'ils veulent.
00:00:56 Avant de passer à un projet mobile, vous devez d'abord déterminer s'il est judicieux de
créer une application mobile à partir d'une transaction SAP GUI existante.
00:01:09 Certaines transactions sont tellement complexes avec des listes volumineuses, des
séquences d'onglets et des zones obligatoires qu'ils ne conviennent pas à devenir une
application mobile.
00:01:21 Dans ces cas, il est préférable de voir si vous pouvez modifier une application SAP Fiori
existante ou créer votre propre application personnalisée.
00:01:32 Mais si vous estimez que votre transaction est un bon candidat pour une application mobile,
il est temps de mieux comprendre votre projet. Pour commencer, demandez à vos parties
prenantes et aux futurs utilisateurs des questions suivantes :
00:01:50 Pourquoi ces opérations spécifiques sont-elles simplifiées de telle sorte qu'elle s'exécute
sur un terminal mobile ? Les utilisateurs peuvent-ils travailler dans des pays ou dans des
domaines où il n'y a pas d'accès en ligne ?
00:02:05 Dans ce cas, SAP Screen Personas n'est pas approprié. À quoi ressemble l'environnement
de travail ?
00:02:13 Qui sera les utilisateurs ou les groupes d'utilisateurs ? Comment sont-ils actuellement en
train de faire leur travail?
00:02:20 Quel est le problème de l'application mobile ? Combien d'utilisateurs l'utiliseront et quelle
sera la fréquence de l'utiliser ?
00:02:29 Quels sont leurs terminaux mobiles préférés ? Quelle est votre période de validité ?
00:02:34 Qui sont vos parties prenantes ? De quel budget et quelles compétences avez-vous besoin
pour accéder à ?
00:02:41 Il ne s'agit pas d'un projet d'une seule personne pouvant être fait du côté. Bien entendu, vos
questions peuvent être différentes, mais cette liste est destinée à vous faire dans la bonne
direction.
00:02:55 Une fois la meilleure compréhension de votre projet, il est temps de réunir votre équipe. Un
projet SAP Screen Personas type doit être doté d'un expert en projets de gestion. C'est une
personne qui sait comment cette transaction
00:03:12 fonctionne en détail, où les zones obligatoires doivent être remplies, etc. Vous avez ensuite
besoin d'un expert SAP Screen Personas.
00:03:21 Il s'agit d'une personne qui connaît son chemin autour de SAP Screen Personas et qui peut
créer des écrans et écrire des scripts avec JavaScript.
00:03:30 Vous avez ensuite besoin d'un chercheur d'utilisateurs ou d'un expert en design. Et c'est
quelqu'un qui peut vous aider à comprendre les besoins des utilisateurs, à créer des
conseils et à piloter la conception des écrans.
00:03:44 Maintenant que vous avez votre structure de projet et une équipe, où avez-vous commencé
? L'utilisation de Design Thinking est toujours un bon point de départ.
00:03:56 Cela vous permettra de guider votre équipe tout au long du projet. Nous avons couvert la
réflexion dans le contexte de SAP Screen Personas dans notre cours d'introduction. Je ne
vais donc pas passer à chaque étape

5
00:04:12 de conception, mais je vais vous montrer comment le faire dans votre projet d'application
mobile. Si vous souhaitez actualiser vos connaissances sur la conception, consultez notre
précédent cours openSAP :
00:04:29 Introduction à SAP Screen Personas. Pour que certaines des étapes de Design Thinking
soient plus concrètes pour vous, nous avons créé un cas d'utilisation hypothétique pour
00:04:41 illustrer certains de ses concepts. Nous maintiendrons ce scénario à travers le reste de la
formation.
00:04:49 Dans notre cas, nous examinerons les travailleurs dans un environnement de bureau
typique, qui proviennent parfois de postes brisés et qui ont besoin de l'attention des sites ou
des équipes informatiques.
00:05:04 Par exemple, un employé veut signaler une imprimante malfonctionnelle, cassé les toilettes,
un éclair, etc. L'attente est qu'il existe un moyen simple de résoudre les problèmes qui
doivent être réparés : comment mettre en place une application mobile ?
00:05:27 Créez un avis de réparation sur le terrain, plutôt que de vous demander de revenir à votre
bureau et d'ouvrir un message sur votre ordinateur portable.
00:05:37 Cela vous empêche d'omettre le numéro de la salle, le nom de l'appareil ou d'autres
informations pertinentes. Donc, comment démarrer.
00:05:48 Familiarisez-vous avec l'application bureautique existante. Familiarisez-vous avec son
fonctionnement et ses limites.
00:05:56 C'est votre base pour tout. D'ici là, les utilisateurs et les parties prenantes sont impliqués.
00:06:03 Parlez aux employés qui utiliseront l’application ainsi que des collègues de l’équipe
informatique et des sites qui interviendront avec les billets. Demandez aux utilisateurs de
créer un message dans le système actuel, de comprendre comment l'informatique ou les
services le concernant, de les
00:06:23 distribuer à un technicien, puis de le fermer. Demandez à vos utilisateurs ce qui fonctionne
bien et ce qui ne l'est pas dans le processus actuel. Les informations dont ils auraient
besoin, mais
00:06:34 qu'ils manquent, les données à l'écran ne sont jamais utilisées. Il est essentiel de connaître
le scénario direct, les fonctionnalités et les informations requises pour fournir des données
suffisantes pour 80 %
00:06:52 des avis, commandes, etc. saisis dans votre système. De cette manière, toutes les parties
impliquées peuvent se poursuivre sans devoir demander à la majorité de l'heure.
00:07:05 Ne commencez donc pas avec vos cas d'arête, concentrez-vous sur votre cas d'utilisation
moyen. Dans notre exemple, nous souhaitons signaler un élément endommagé ou
dysfonctionnement dans un certain emplacement.
00:07:21 Les installations et l'équipe informatique de notre scénario nécessitent un emplacement, un
étage, une salle, un type d'appareil, un numéro d'appareil, une description de l'incident et le
niveau de priorité.
00:07:35 Vous obtiendrez une compréhension de votre scénario de 80 % au cours de votre
recherche. Assurez-vous de confirmer en fait les données requises avec tous vos
utilisateurs.
00:07:48 Maintenant que vous avez observé, interrogé et trouvé votre scénario type, l'aspect de
recherche utilisateur de ce projet est terminé. Il analyse ensuite les données de vos
entretiens et observations et recherche les modèles.
00:08:07 Vous pouvez utiliser les résultats de cette analyse pour créer une conception générale sur
un tableau blanc avec votre équipe de projet. Vous devez uniquement vous concentrer sur
les données qui doivent figurer sur cet écran.
00:08:23 Ainsi, à partir de votre analyse de données, vous savez exactement les zones dont les
utilisateurs ont besoin à l'écran : l'emplacement, le bâtiment, l'étage, la salle, l'équipement,
la description du problème, la priorité, le statut, etc.
00:08:39 Donc, pourquoi ne pas vous énumérer sur le tableau blanc ? Cela signifie, par exemple,
que le site, le bâtiment, l'étage, la salle, l'équipement, la description, la priorité et le statut.

6
00:09:06 Vous avez ensuite besoin d'une sauvegarde ou d'un bouton de soumission, en fonction de
vos directives et également d'une annulation. Maintenant qu'il n'y a pas été dit, on peut
ajouter à l'écran avec SAP Screen Personas où l'auteur d'un problème recherche
simplement le code QR
00:09:28 de l'ordinateur cassé et que la plupart des données listées ici sont automatiquement pré-
remplies après la numérisation. Je vais donc ajouter ici le code QR "scan" à la liste.
00:09:47 Lorsque vous scannez cela, tous ces éléments sont automatiquement renseignés
automatiquement. C'est pourquoi vous ne souhaitez peut-être pas commencer par
l'emplacement, le bâtiment, la salle, mais plus probablement l'équipement
00:10:03 et la description du problème, la priorité et le statut. Ce serait donc là.
00:10:08 C'est donc la première, c'est la seconde, et c'est la troisième sur l'écran. En dessous, les
données seront remplies et vous pouvez afficher l'emplacement exact après le scan pour
obtenir une confirmation indiquant
00:10:25 qu'il s'agit de la bonne machine. Par conséquent, la prochaine serait de présenter tout ce
qui se passe en un premier projet de premier plan.
00:10:37 Commencez donc par un cadre téléphonique, ce qui pourrait ressembler à cela. Cela ne
doit pas être trop peu, mais vous obtenez un sentiment.
00:10:47 Ensuite, vous commencez par votre code QR de balayage. C'est donc ici votre bouton
Analyser.
00:10:54 Il s'agit de l'équipement affiché ici. Ajoutez ensuite la description.
00:11:00 Ici, vous avez besoin d'une zone de saisie dans laquelle vous pouvez saisir les éléments.
Vous ajoutez la priorité et le statut et l'emplacement sera automatiquement renseigné
lorsque vous scannez le code QR.
00:11:16 À présent, vous ajoutez le bouton Sauvegarder ou le bouton Soumettre et une Annuler.
C'est donc ce qu'on pourrait dire très très.
00:11:27 Utilisez ces modèles initiaux pour créer une maquette avec des idées de veuf, où vous
incluez un design visuel, en plus des données nécessaires. Après avoir effectué vos
premières schémas, testez vos idées avec votre groupe d'utilisateurs et vos parties
prenantes et faites un suivi sur la
00:11:44 base de leurs commentaires. Continuez à les tester jusqu'à ce que vous ayez droit, car cela
servira de base pour l'étape suivante :
00:11:53 la création de vos variantes avec la conception finale. Nous ne sommes pas parvenus à le
montrer ici, car nous allons construire les variantes tout au long des autres unités de ce
cours.
00:12:06 Une fois que vous avez créé vos variantes, transférez-les à votre groupe de test et activez-
les. Continuez à inclure le feedback de vos utilisateurs à l'aide de l'outil d'ouverture et de
rappel de la variante.
00:12:22 Une fois que vous disposez d'une variante qui intègre correctement le feedback de vos
utilisateurs, il est temps de s'assurer du déploiement officiel.
00:12:32 Deux facteurs très importants dans ce déploiement sont la communication avec les
utilisateurs et le processus de gestion des changements requis pour tous les processus qui
seront différents de ceux qui seront différents.
00:12:46 Si vos utilisateurs finaux ne savent pas ce qui se passe, ce qui se passe, voire penser qu'il
s'agit d'une autre transaction ou d'une autre modification, que votre projet échoue et que les
utilisateurs ne l'utilisent pas.
00:13:06 Effectuez le marketing pour votre projet et l'application qui en résulte. Il y a suffisamment
d'idées sur la façon d'obtenir les utilisateurs impliqués dans les entretiens, le test, le
programme financier, le
00:13:20 programme, les petits extraits vidéo - vous le faites ! Avec tout cela, vous avez à présent,
en théorie, une structure de la configuration du projet et la manière d'obtenir la conception
souhaitée de
00:13:36 l'application. Aujourd'hui, nous avons parlé de la planification que vous devez accomplir
pour votre projet d'application mobile.

7
00:13:45 Vous avez découvert les questions importantes auxquelles vous devez répondre avant de
commencer votre projet : est-il pertinent de remanier et de simplifier une transaction SAP
GUI existante pour un terminal mobile ?
00:13:59 Quelle transaction allez-vous simplifier ? Qui a besoin de cette application mobile ?
00:14:03 Pourquoi ont-ils besoin de cela? Qu'est-ce qu'un environnement de travail ?
00:14:08 Les utilisateurs ont-ils besoin d'un accès hors ligne ? Et ainsi de suite.
00:14:13 Nous avons discuté des membres requis de votre équipe de projet, puis nous avons évoqué
la manière d'intégrer la réflexion sur la conception dans votre projet, ainsi que la manière de
répondre à la gestion des changements et le résultat du projet est une application mobile
qui mettra
00:14:32 en œuvre une application mobile plus performante. La prochaine fois, nous parlerons des
considérations que vous devez prendre lors de la conception des applications mobiles.
00:14:44 Merci d'avoir visionné !

8
Week 1 Unit 4

00:00:07 Bonjour et bienvenue à la semaine one, unité quatre, de notre cours openSAP, création
d'applications mobiles avec SAP Screen Personas. Mon nom est Peter Spielvogel.
00:00:17 La dernière fois, nous avons parlé de la conception de rôle dans le cadre de la planification
de votre projet d'application mobile et de la saisie des besoins du client pour créer une
structure approximative de votre application.
00:00:27 Nous avons également introduit le scénario de gestion pour lequel nous allons construire
notre application mobile au cours de ce cours et les ensembles de compétences généraux
que vous devriez avoir sur votre équipe.
00:00:36 Aujourd'hui, nous allons nous concentrer sur les exigences de conception unique pour les
applications mobiles, qui sont quelque peu différentes que pour les variantes de bureau, car
vous avez beaucoup moins de biens immobiliers pour travailler avec.
00:00:47 Le plus petit facteur de formulaire d'applications mobiles détermine leur comportement et
leur comportement et vous oblige à hiérarchiser vos tâches. Un élément commun
permettant de concevoir n'importe quelle application, qu'il s'agisse d'un ordinateur ou d'un
terminal
00:01:01 mobile, est que vous devez commencer par l'utilisateur et réfléchir à la manière dont ils
interagissent avec l'application. Dans le cadre de la dernière unité, nous avons parlé des
concepteurs de rôle dans la compréhension des besoins des utilisateurs.
00:01:14 Comme pour la plupart des fonctions d'emploi, il existe plusieurs types de concepteurs.
Pour un projet SAP Screen Personas réussi, vous devez avoir à la fois des concepteurs et
des concepteurs visuels pour votre équipe,
00:01:26 étant donné qu'ils jouent un rôle clé et des rôles complémentaires. Les concepteurs
d'interaction se concentrent sur le scénario de gestion et les workflows globaux.
00:01:35 Ils produisent des diagrammes de fil de fer qui illustrent la façon dont les personnes seront
soumises à l'application. Ils garantissent que l'application sera pertinente lorsque les
personnes l'utilisent.
00:01:45 Les concepteurs visuels vous aident à concevoir une application agréable. Il s'agit souvent
du rôle que les gens pensent lorsqu'ils entendent le terme "concepteur".
00:01:54 Les concepteurs visuels mettent l'accent sur les normes d'entreprise et l'alignement des
couleurs, des polices et des mises en forme avec vos directives d'entreprise.
00:02:02 Sans concepteur de visualisation compétent, il est peu probable que vous terminerez avec
une application Google. Vous devez disposer d'une compréhension de base de la
conception pour travailler efficacement avec vos utilisateurs et concepteurs
00:02:13 d'entreprise. La chose la plus fondamentale à prendre en compte lors de la création d'une
application mobile est que les écrans sont petits.
00:02:20 Vous devrez donc définir les priorités de l'application, puis concentrer l'utilisateur sur une
tâche unique. Il se peut que deux tâches soient étroitement liées.
00:02:28 Cela peut nécessiter l'interruption d'une transaction individuelle en blocs plus petits. Ne
tentez pas de répliquer les fonctionnalités complètes d'une transaction SAP GUI qui
s'exécute sur le bureau.
00:02:39 L'effort de développement ou l'écran résultant sera trop complexe pour être utile ou gérable.
Créez plutôt une variante centrée sur l'une ou l'autre des tâches que vous avez à l'esprit.

00:02:52 Pour optimiser l'écran limité de l'immobilier, décidez si vos utilisateurs utilisent l'application
sur une tablette ou un téléphone ou les deux.
00:02:59 Créez ensuite des écrans dédiés aux appareils qui exécuteront vos applications. Des
versions différentes de l'application seront probablement requises pour chaque taille
d'écran, peut-être même les versions
00:03:10 d'infrastructure et de portrait. Pour l'application que les personnes utiliseront pour signaler
les postes cassés autour du bureau, nous aurons certainement besoin

9
00:03:17 d'une version de téléphone. La plupart d'entre eux portent leurs téléphones autour d'eux. Ils
auront donc l'outil dont ils ont besoin pour créer des avis de
00:03:25 réparation, où qu'ils soient. De nombreuses personnes utilisent également des tablettes et
les mènent à des réunions, car elles sont beaucoup plus utiles pour
00:03:32 prendre des notes, puisque le clavier est plus large et plus facile à utiliser. Nous devrions
donc prévoir la création d'une tablette et d'une version de téléphone de notre application de
notification.
00:03:43 SAP Screen Personas facilite la création de variantes et la réutilisation de votre logique.
Nous appelons ces « variantes adaptatives ».
00:03:51 Cette fonctionnalité bascule automatiquement les variantes en fonction de la taille de l'écran
disponible. Créez simplement votre variante principale, qui peut se trouver sur un bureau,
puis créez des variantes pour chaque appareil ou facteur
00:04:03 de formulaire et indiquez à SAP Screen Personas la taille de la bascule vers la suivante.
Nous vous montrerons exactement comment faire au cours de la deuxième semaine du
cours.
00:04:13 Lorsque vous créez des écrans pour terminaux mobiles, il y a quelques autres éléments à
garder à l'esprit. Ne pas surcharger l'utilisateur avec trop de choix.
00:04:22 Une application simple est vraiment bien meilleure qu'une application mobile plus
complexe. S'il ne fonctionne pas rapidement et simplement, les gens ne les utilisent pas.
00:04:33 Vous disposez probablement d'au moins quelques exemples sur votre propre téléphone.
Par exemple, au lieu de fournir toutes les options permettant de créer un avis de service,
sélectionnez le chemin que les personnes
00:04:44 prennent la plupart du temps. Il existe généralement 80 ou 90 % de chemin que les
personnes suivent généralement.
00:04:52 N'ajoutez pas de complexité à votre application qui ralentira tout le monde en forçant des
clics supplémentaires au nom des scénarios qui ne surviennent que 10 ou 20 % du temps.

00:05:02 Si vous devez les couvrir dans votre application mobile, disposez d'un chemin rapide et d'un
itinéraire distinct ou même d'une autre application pour les cas plus complexes.
00:05:12 Dans la même remarque, les bonnes applications mobiles suivent un principe appelé la
divulgation progressive. En d'autres termes, vous présentez le nombre minimum
d'informations requises pour une tâche, tout en permettant aux utilisateurs
00:05:24 d'accéder à davantage de détails, si nécessaire. Non seulement cela permet de simplifier la
conception d'écran. En règle générale, elle améliore également les performances lorsque

00:05:32 vous récupérez moins d'informations à partir du backend. C'est particulièrement important
pour les applications mobiles car elles ont souvent des connexions plus lentes que dans un

00:05:41 environnement de bureau. Vous pouvez utiliser la divulgation progressive dans l'exemple ci-
dessus concernant la création d'un avis de service.
00:05:48 Permettre aux personnes de saisir les informations minimales requises, puis d'ajouter
davantage de détails, si nécessaire. Nous avons une nouvelle fonctionnalité dans SAP
Screen Personas appelée Viewports, ce qui est particulièrement utile pour la
00:06:01 décomposition d'écrans complexes en unités plus simples. Nous aborderons cette question
la semaine prochaine.
00:06:06 Il y a quelques autres conseils de conception qui rendront votre application mobile plus
utilisable. Essayez de réduire le défilement vertical et de conserver tout ou partie des
boutons clés et des informations sur l'écran initial.
00:06:19 Cela sera plus facile sur les périphériques les plus grands. Ainsi, vous souhaitez
probablement prendre en compte des fonctionnalités plus simples pour les téléphones par
rapport à votre application de tablette.
00:06:29 Dans tous les cas, il est recommandé d'éliminer tout défilement horizontal car il est difficile
de gérer le contexte à l'écran s'il effectue deux dimensions plutôt qu'une seule.

10
00:06:40 Pensez à l'affichage de votre écran. Si vous réduisez un écran de bureau aux dimensions
d'un téléphone, le texte sera probablement trop petit pour que la plupart des
00:06:49 utilisateurs lisent. Lors de la conception de votre application, tenez compte de la taille de la
police et de la police.
00:06:55 Certaines formes de type sont plus faciles à lire que d'autres. De même pour les boutons de
commande à l'écran, assurez-vous qu'ils sont suffisamment grand pour cliquer facilement,
avec suffisamment
00:07:05 d'espace pour que votre utilisateur n'ait pas d'une mauvaise occurrence. La meilleure règle
de lisibilité consiste à tester avec un grand nombre d'utilisateurs dans différents groupes
d'âge.
00:07:15 Vous pouvez alors vous assurer que tous les employés de votre bureau peuvent utiliser
l'application. Autre facteur à prendre en considération : comment les personnes
interagissent avec l'écran.
00:07:24 Pour les tablettes, il pourrait être similaire à la façon dont les employés utilisent un système
de bureau, si la tablette est assise à une surface plate donnant aux utilisateurs un accès
complet au clavier.
00:07:34 Ou bien, ils risquent d'avoir une main d'une main et d'en saisir l'autre. Pour les téléphones,
certaines personnes les détiennent d'une main et de l'autre.
00:07:43 Une autre possibilité est que quelqu'un puisse faire fonctionner le téléphone d'une main.
Pour la catégorie d'opération commerciale, envisagez de placer les boutons d'action en bas
pour faciliter l'opération à main d'œuvre.
00:07:56 Découvrez de nouveau comment vos utilisateurs interagissent avec des prototypes de votre
application pour déterminer comment ajuster les sites de contrôle à l'écran.
00:08:06 La navigation joue souvent un rôle majeur dans la manière dont est utilisable une
application. Si votre application comporte plusieurs étapes, chaque bâtiment de la
précédente, une personne peut perdre son contexte.
00:08:17 Par exemple, si vous créez un avis de service, vous devrez peut-être saisir une description
de l'article cassé, son emplacement et les symptômes du problème.
00:08:26 Si vous le faites au téléphone, il est probable que vous ayez besoin de le faire dans des
écrans distincts pour des raisons d'espace. Il est donc toujours facile de naviguer dans
l'écran initial de l'écran d'accueil, s'il s'agit d'une simple navigation vers l'écran
00:08:42 d'accueil, s'il est perdu dans l'application. Aujourd'hui, nous avons parlé de conception
d'applications mobiles et de la façon de tirer le meilleur parti d'un écran de téléphone ou
00:08:51 de tablette. Nous avons couvert les différences entre les concepteurs d'interaction et les
concepteurs visuels, pourquoi les deux rôles
00:08:58 jouent un rôle important dans votre équipe de projet. Nous avons parlé de l’importance
d’examiner toutes les fonctionnalités d’une transaction SAP GUI et de déterminer comment

00:09:07 les déplacer dans des applications individuelles. Nous avons discuté de différents facteurs à
prendre en compte lors de la conception d'une application mobile, comme la divulgation
00:09:15 progressive, la typographie, la mise en page des boutons de commande et la navigation. La
prochaine fois, nous parlerons de l'utilisation de l'éditeur SAP Screen Personas dans le
moteur Slipstream, où vous aurez l'occasion
00:09:25 de présenter la théorie dont nous avons parlé jusqu'à présent en partant de la création
d'une application mobile avec SAP Screen Personas.
00:09:32 Merci.

11
Week 1 Unit 5

00:00:06 Bonjour, et bienvenue à la semaine one, unité cinq, de notre cours openSAP, création
d'applications mobiles avec SAP Screen Personas. Je suis Vandana approfondi.
00:00:15 La dernière fois, nous avons évoqué certaines meilleures pratiques pour la conception des
applications mobiles à l'aide de SAP Screen Personas. Aujourd'hui, nous allons nous
concentrer sur la création d'une variante conçue pour un terminal mobile à l'aide de l'éditeur
SAP Screen Personas
00:00:29 dans Slipstream Engine. Examinons la transaction de création de notification, IW21.
00:00:35 Ici, je vais indiquer le type d'avis "m2" et le nombre d'occurrences. Cela m'amène à l'écran
de transaction.
00:00:42 Aujourd'hui, sur une tablette, il s'agit de trop d'informations. Nous attendons donc que les
travailleurs puissent rapidement journaliser un rapport en matière d'équipements
malveillants.
00:00:55 Les éléments d'écran qui peuvent être importants pour eux sont le poste technique de
l'onglet Notification , les détails de l'équipement et, bien entendu, la description et le texte
descriptif du sujet.
00:01:07 En outre, le travailleur doit fournir la date et l'heure de début de la panne et s'il s'agit d'un
arrêt ou non. Les autres informations qui doivent être entourées sur l'appareil tablette
proviennent des données de localisation.
00:01:25 Dans les données de localisation, nous avons la division de localisation, le site, la salle, la
section division et le poste de travail. Voyons comment fonctionne cette transaction.
00:01:40 Je passe donc à l'onglet Notification. Je spécifie l'équipement.
00:01:47 Permettez-moi de revenir sur le cadre de la boîte postale. Je précise les erreurs de ce qu'il
faut dans le cadre de la boîte postale.
00:02:02 Je clique ensuite sur Sauvegarder. La notification est sauvegardée.
00:02:07 Une fois que vous avez enregistré les besoins de l'utilisateur clé pour une application
mobile, vous pouvez la créer à l'aide de l'Editeur de variante dans le moteur Slipstream.
00:02:15 Il est important de noter que les variantes peuvent être créées et traitées uniquement sur le
bureau à l'aide de l'éditeur. Une fois créés, les variantes peuvent être affichées sur le
terminal mobile cible.
00:02:26 C'est pourquoi nous avons commencé à créer cette variante pour la transaction.
Commençons par créer une copie de cette transaction originale et non modifiée.
00:02:37 Penchons-nous : "Avis SPS4 W1U5".
00:02:55 La première chose que je souhaite faire est d'ignorer cet écran car je vais indiquer le type
d'avis par défaut. La manière dont nous allons faire cela s'effectue en utilisant le scripting.
00:03:05 Sauvegardons donc la variante. Passons à l'éditeur de script.
00:03:16 Je vais maintenant utiliser l'enregistrement de début pour le script afin de fournir un script
pour la valeur par défaut du type d'avis. Permettez-moi de créer un script.
00:03:35 Penchons-nous dès maintenant sur l'enregistrement. Je vais fournir une valeur par défaut, «
m2 », ici...
00:03:47 et d'occurrences. C'est un point d'arrêt de l'enregistrement.
00:03:52 Vous devriez être en mesure de modifier rapidement le script s'il est requis ici. Sinon, le
script est prêt à être ouvert.
00:03:59 Nous avons mis l'accent sur le champ. Nous avons spécifié la valeur par défaut et
l'occurrence.
00:04:08 Maintenant que je suis dans la variante, je dois spécifier ce script comme script de
chargement pour la variante. La manière dont je fais partie est de mettre la variante en
mode de traitement.
00:04:18 Je accède à l'onglet Insertion. Et dans l'événement de l'écran, je vais indiquer le script
onLoad, qui est le type d'avis par défaut.

12
00:04:28 Nous sommes en train de le faire et nous le sauverons. Maintenant, faisons en sorte que
cela fonctionne correctement.
00:04:37 Je vais passer à la vue originale. Je vais marquer cette variante en tant que variante par
défaut pour cette transaction.
00:04:45 Maintenant que nous sommes dans le second écran pour la transaction, commençons à
modifier l'écran de transaction pour l'appareil tablette. Allons de cette variante en mode de
traitement.
00:05:01 La première chose que nous souhaitons faire est de changer le titre de la variante. Nous
appellerons l'avis de panne.
00:05:12 Nous voulons à présent masquer le contrôle de l'arbre. Nous sélectionnons donc ici le tree
control.
00:05:18 Cliquez sur Masquer. Nous souhaitons également masquer la barre d'outils GUI.
00:05:29 Aujourd'hui, la section de notification est déjà définie par défaut sur "m2", c'est pourquoi il
est également possible de masquer complètement cette section.
00:05:42 Maintenant, déplacez cet onglet un peu plus bas pour que nous ayons davantage de place
pour commencer à construire notre tablette. Pour ce faire, commencez par sélectionner les
éléments d'écran pour le poste technique et l'équipement et déplacez-les vers la variante.

00:06:07 Ensuite, nous allons déplacer la description et le texte descriptif... Nous faisons maintenant
l'onglet Notification.
00:06:33 Avant de passer à l'onglet Dysfonctionnement, permettez-moi de vous montrer un rapide
qui vous permettra d'aligner correctement l'écran. Voyons dans l'onglet Conception.
00:06:46 Nous avons ces lignes d'aide. Par conséquent, si vous avez plusieurs éléments d'écran à
aligner et sur l'espace, vous pouvez utiliser cet outil spécifique.
00:06:56 Je peux sélectionner une couleur différente pour les lignes d'aide, activer les lignes d'aide et
activer le mode instantané. Cela permet un meilleur contrôle en termes de positionnement
et d'espacement des éléments.
00:07:09 Pour ce faire, passez à l'onglet Panne. De là, nous souhaitons la date de début de la
panne, l'heure et la case à cocher pour le découpage.
00:07:30 Maintenant que nous sommes en train d'effectuer l'onglet Panne , passez aux - données du
site ». Il y a maintenant quelques champs que nous souhaitons faire glisser dans l'écran de
transaction.
00:07:41 Nous allons donc utiliser l'outil lasso. Et, sur mon Mac, je vais utiliser la fonction Clé
d'équipe pour sélectionner plusieurs éléments.
00:08:02 Maintenant que nous avons toutes les données de ces onglets, nous pouvons simplement
masquer la barre d'onglets. Sauvegardons la variante.
00:08:10 Une dernière chose : nous préparons cette variante pour une tablette, nous voulons donc
définir la largeur de la variante. Nous allons accéder à l'onglet Validation.
00:08:21 Et dans la zone Largeur, nous allons indiquer 1000 unités. Cette zone grise sur la variante
indique où la variante est tronquée si l'appareil utilisé pour le rendu de cette variante est de
1 000 largeur.
00:08:37 Il vous fournit donc un marqueur sur la façon d'ajuster les éléments de l'écran de façon à ce
qu'ils se trouvent dans la largeur de l'appareil. Maintenant que notre variante est correcte en
ce qui concerne le placement de contrôles et les contrôles dont nous avons besoin sur la

00:08:55 variante, définissez le comportement du bouton Enregistrer. Nous souhaitons que la valeur
de l'équipement, la zone de description et la date de début de la panne soient indiquées
avant que l'utilisateur ne
00:09:11 soit indiqué sur Soumettre. Nous allons donc devoir créer un script pour enregistrer une
notification, ce qui fait cette validation de base.
00:09:21 Avant de procéder, je vais adapter ici les alignements d'éléments d'écran pour la zone de
description. Nous allons lancer l'éditeur de script.

13
00:09:38 Créez un script pour la notification de sauvegarde qui sera exécutée lorsque vous cliquez
sur le bouton Sauvegarder. Pour ce faire, nous allons d'abord créer un script.
00:09:50 Comme indiqué, nous devons vérifier si l'équipement, la description et la date de début de
la panne ont une valeur spécifiée. Pour ce faire, utilisez le sélecteur d'objets.
00:10:05 Nous allons sélectionner le champ d'équipement... et vérifiez la valeur de texte ici.
00:10:29 De même, nous allons vérifier la valeur de texte pour la description et les zones de panne.
Désormais, si l'utilisateur n'a spécifié aucune valeur dans l'une de ces zones, nous
souhaitons qu'une boîte de dialogue d'options s'affiche pour
00:10:59 l'utilisateur qui invite l'utilisateur à spécifier une valeur pour ces champs obligatoires, puis
cliquez sur Soumettre. J'ai déjà un appel à la session .utils.showOptionDialog, qui invite
l'utilisateur à spécifier les valeurs requises et comporte également un
00:11:15 rappel pour l'option OptionDialogClose. Je vais simplement définir la fonction de rappel.
00:11:26 Maintenant ma condition "Si" est terminée, je souhaite également vous assurer que si
l'utilisateur a indiqué toutes ces valeurs, alors dans le cas "Autre" que nous avons atteint
sur Soumettre.
00:11:44 Si toutes ces valeurs sont spécifiées, il vous suffit de sauvegarder l'avis. Nous sommes à la
hauteur de ce script.
00:11:56 La dernière chose que nous devons faire est de masquer le bouton Enregistrer et de créer
un Bouton de script qui appelle notre script. Passez en mode de modification pour la
variante.
00:12:32 Et sous l'onglet Valider , nous avons un aperçu de l'appareil. Nous allons donc cliquer sur
ce point.
00:12:39 Maintenant que nous sommes en train de construire cette variante pour une tablette, nous
voulons juste faire en sorte que la variante soit adaptée à une tablette.
00:12:47 Dans mon cas, j'ai un iPad. Je vais donc cliquer sur une tablette, puis sélectionner l'iPad
d'Apple. Ici.
00:12:57 Cela me donne une bonne mise en page de la manière dont la variante ressemblera à une
tablette. Je peux modifier l'orientation de l'appareil pour voir comment elle ressemblera
dans une infrastructure et un mode portrait.
00:13:09 Notez que nous pouvons également sélectionner "Afficher tous les appareils" et filtrer les
appareils disponibles pour l'aperçu. Maintenant que je suis satisfait de la façon dont la
variante examine la tablette, je ferais mon aperçu et je suis prêt à tester cette variante
00:13:31 sur une tablette. Nous allons sélectionner notre équipement.
00:13:39 Pour l'équipement indiqué, il est nécessaire d'indiquer la description de l'avis. J'ai indiqué la
description et je peux sauvegarder la notification.
00:13:58 Cela nous amène à la fin de l'unité aujourd'hui. Aujourd'hui, nous avons montré comment
créer une variante pour un appareil mobile et l'obtenir de l'aperçu de la taille de l'écran cible
à
00:14:08 l'aide de l'éditeur dans Slipstream Engine. Puisqu'il s'agit de la dernière unité de notre
semaine, nous pouvons résumer ce que nous avons appris cette semaine.
00:14:16 Cette semaine, nous vous avons donné une introduction aux applications mobiles à faible
code à l'aide du moteur SAP Screen Personas Slipstream. Nous faisons partie de
l'architecture du moteur Slipstream.
00:14:27 Nous avons évoqué les meilleures pratiques en matière de planification et de création
d'applications mobiles, et nous avons créé une variante pour les employés de bureau pour
créer une notification depuis leur tablette.
00:14:38 La semaine prochaine, nous parlerons de la conception de vos variantes pour les
différentes tailles d'écran, en accédant à des fonctionnalités natives de terminal à partir de
vos variantes mobiles, en créant des modèles pour les variantes mobiles afin d'obtenir des
assistants
00:14:51 cohérents, de créer des assistants avec des fenêtres d'affichage et, enfin, d'optimiser les
performances des variantes mobiles. Merci.

14
www.sap.com/contactsap

© 2018 SAP SE or an SAP affiliate company. All rights reserved.

No part of this publication may be reproduced or transmitted in any form or for any purpose without the express permission of SAP SE or an SAP affiliate company.

The information contained herein may be changed without prior notice. Some software products marketed by SAP SE and its distributors contain proprietary software components of other software vendors.
National product specifications may vary.

These materials are provided by SAP SE or an SAP affiliate company for informational purposes only, without representation or warranty of any kind, and SAP or its affiliated companies shall not be liable
for errors or omissions with respect to the materials. The only warranties for SAP or SAP affiliate company products and services are those that are set forth in the express warranty statements
accompanying such products and services, if any. Nothing herein should be construed as constituting an additional warranty.

In particular, SAP SE or its affiliated companies have no obligation to pursue any course of business outlined in this document or any related presentation, or to develop or release any functionality
mentioned therein. This document, or any related presentation, and SAP SE’s or its affiliated companies’ strategy and possible future developments, products, and/or platform directions and functionality are
all subject to change and may be changed by SAP SE or its affiliated companies at any time for any reason without notice. The information in this document is not a commitment, promise, or legal obligation
to deliver any material, code, or functionality. All forward-looking statements are subject to various risks and uncertainties that could cause actual results to differ materially from e xpectations. Readers are
cautioned not to place undue reliance on these forward-looking statements, and they should not be relied upon in making purchasing decisions.

SAP and other SAP products and services mentioned herein as well as their respective logos are trademarks or registered trademarks of SAP SE (or an SAP affiliate company) in Germany and other
countries. All other product and service names mentioned are the trademarks of their respective companies. See http://www.sap.com/corporate-en/legal/copyright/index.epx for additional trademark
information and notices.