This document discusses several topics related to user experience (UX) and user interface (UI) design for mobile applications: 1. It announces upcoming discussions on trends in UX by Remy Bourganel and other topics on UX and UI. 2. It then shares a summary of Remy Bourganel's presentation on trends in UX, including how services can learn from user behavior over time to provide more personalized experiences. 3. It discusses the importance of considering performance when designing mobile applications to improve user engagement, conversions, and brand trust. Faster applications can significantly improve business metrics.

1. 24 Mars 2015 - @lafrenchmobile
Supporters
La première communauté française dans l'écosystème
mobile créé en 2010
400 membres : Freelance, Développeurs, Agence Mobile,
Opérateurs, Constructeurs, SSII…
Lafrenchmobile intervient dans de nombreux domaines,
formation, démarrer des plates-formes, trouver des
talents…
www.lafrenchmobile.com

2. UX, UI sur Mobile, moteur de l'engagement client!
HTAG!:!#lafrenchmobile!4!#UX!#UI!
!"1" Les tendances de l'UX par Remy Bourganel"
!"2"Ux republic "
!"3"l’UX, différenciateur clef By Tapptic"
!"4"En finir avec les applications lentes !
Comment améliorer la performance de vos apps By screenage"
!"5"L'experience de recherche,
facteur clé de l'engagement utilisateur sur mobile By Algolia"
24 Mars 2015 - @lafrenchmobile
Supporters

3. Toward the internet of uses
24.03.2015

4. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
• Digital services are now in their very nature in constant transformation.
• AI/machine learning is being democratised, services can effectively learn from:
> Your behaviours
> Context
> Many other sources of aggregated data
> Broader context, as a system (like a city)
A new era

5. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Diachronic vs synchronic
Muji vs…
Aether music player, evovle/learn from context (place/time)
Services involving programmable matter are diachronic.
They reveal and evolve over time. The design becomes conversational with user.
Design principles are grounding the ethics.
Design principles help bridging evolving experiences.
Design principles frame the big picture.

6. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Context is king
Context: People/Time (before, during, after)/Place
Minkowski’s space-time: light cone and hyper surface of the present.
As an analogy for:
Future and past having
more value than a thin now
Minkoski’s model

7. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
> Sense: the experience of perceiving what’s going on, in real time,
as from data collected from sensors, or from haptics feedback.
> Reflect: the experience of stepping-back, putting into perspective
from patterns contemplation.
> Do: the experience of enhanced/coached action or decision-making
from data analytics, machine-learning, recommendation and
behavioural change algorythms.
Data as core material: 3 experience spaces converging

8. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Making the invisible
visible,
sense
The ‘nuage vert’
Helsinki
2009
3 experience spaces converging

9. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Making the invisible
visible,
reflect
Dopplr traveler
footprint
2009
3 experience spaces converging

10. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Making the invisible
visible,
reflect
3D footprint
Time spent by location
C. Ramus, Orange, 2012
3 experience spaces converging

11. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Making the invisible
visible,
reflect through time
5.39
Taxi traffic in Lisbon
Line thickness: density, green: high speed, red: slow speed
2009
3 experience spaces converging

12. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Making the invisible
visible,
reflect through time
10.17
Taxi traffic in Lisbon
Line thickness: density, green: high speed, red: slow speed
2009
3 experience spaces converging

13. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Making the invisible
visible,
reflect through time
19.33
Taxi traffic in Lisbon
Line thickness: density, green: high speed, red: slow speed
2009
3 experience spaces converging

14. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Do
Taxi traffic
About 10 mn for a taxi
Book now?
3 experience spaces converging

15. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
Do
Taxi traffic
About 10 mn for a taxi
At this time, it’s usually 30 mn.
Book now?
3 experience spaces converging

16. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
From this capability to collect, analyse and report the big data:
• The GAFA is to offer personalisation through the learning of your behaviours
• But it might lead to a dead end.
Imagine a ‘Google now’ like service for tourism.
Google learning all from your behaviours could automatically create a tour for you
as you arrive in, say, NYC.
Problem is that you came to NYC 10 times. And you need editorial content, at the
junction of Google now’s knowledge and Guide du Routard…
Personalisation vs editorialisation

17. Remy Bourganel | Tendances UX | meetup | laFrenchMobile | © 2015
• Match-making between your profile and content offerings has a long future and
is desirable because:
> Of our need to belonging to a community
> Our need to be inspired
> Of cultural diversity
Welcome to the era of the internet of uses!
Match-making content/behaviours & needs

18. UX - UI
Moteur de l’engagement client
@Tapptic
A L E X A N D R E D E S A E D E L E E R
M X M a n a g e r
m x @ t a p p t i c . c o m

19. Chiffres clés
2,5 millions d’app

20. UX - UI
Pensez UX !
Une app mobile est une expérience vécue nulle part ailleurs…
1er contact Contexte
98%
Wireframes
Utilisateur ! Moments
mobiles
Habitudes
Cohérence
Références
Conception
Design
Test
Process mobile

21. UX - UI
Moteur de l’engagement client
A L E X A N D R E D E S A E D E L E E R
M X M a n a g e r
m x @ t a p p t i c . c o m
@Tapptic

22. Olivier Milcent - Fondateur
@omilcent

23. Screen Age - 2015 2
Screen Age
INGÉNIERIE | CONSEIL | FORMATION
Nous sommes experts de
la performance d’affichage.
Nous aidons les éditeurs à rendre leur
applications plus rapides.

24. Screen Age - 2015 3
0,1 s —› 1% de revenus

25. Screen Age - 2015 4
20% de temps gagné —› +25% de PVs
+12% conversions

26. Screen Age - 2015 5
2,2s gagnée —› +15% de
conversions

27. Screen Age - 2015 6
LE POTENTIEL DE REVENUS
L’USAGE
LA CONFIANCE DANS LA MARQUE
Une application lente impacte…

28. Screen Age - 2015 7
Pourquoi une application est-elle lente ?
Code natif
Politique de chargement, prefetch insuffisant,
scrolling sacaddé, GPU/CPU désynchronisé, gestion
de la mémoire…
2
Code hybride / HTML3 Manque d’optimisation des images, structure des
données, caching des users-agents, CSS, JS…
Qualité de l’hébergement4 Utilisation de CDN, caching et fragments, scalabilité,
tests de charges…
Surchage d’images, non-respect des guidelines, animations mal
pensées, peu de réflexion sur la “performance ressentie”…
UX Design1

29. Screen Age - 2015 8
Penser performance-first
Performance
coding
Performance
testing
Performance
monitoring
Performance
design

30. Screen Age - 2015 9
Penser performance-first
Performance
design
Performance
coding
Performance
testing
Performance
monitoring
๏
Priorités fonctionnelles
๏
Design en séquences (flows)
๏
Prototyper et itérer avec les développeurs
๏
Définir les indicateurs de performances
๏
Design patterns de “performance ressentie”

31. Screen Age - 2015 10
Penser performance-first
Performance
design
Performance
coding
Performance
testing
Performance
monitoring
๏
Coder, tester et valider séquence après séquence
๏
Préférer le code natif !
๏
Utiliser des composants hybrides privilégiant la performance (parser HTML
natif, AngularJS, Ionic)
๏
Optimiser les images (incluant le format Retina)
๏
Caching, DNS prefetch, des dizaines d’autres best practices à utiliser

32. Screen Age - 2015 11
Penser performance-first
Performance
design
Performance
coding
Performance
testing
Performance
monitoring
๏
Mesurer via des indicateurs stables
๏
Utilisation d’outils spéficiques de debug
๏
Outil d’analyse de temps de réponses HTML/API
๏
Outil de simulation de réseau
๏
Tests de montée en charge
๏
Tests sur terminaux réels

33. Screen Age - 2015 12
Penser performance-first
Performance
design
Performance
coding
Performance
testing
Performance
monitoring
๏
Monitoring des API
๏
Alertes de bugs et de crash en temps réels
๏
Analyse par type de réseau, de device et de region
๏
Monitoring de non-regression lors des updates

34. On recherche des talents !
(si vous êtes client, ça m’intéresse aussi)
omilcent@screenage.fr
@omilcent