DryadLINQ Comment passer à l'échelle le traitement de données volumineuses ?
Bien passer le Store : Le respect des guidelines
-
Upload
microsoft-technet-france -
Category
Technology
-
view
232 -
download
1
description
Transcript of Bien passer le Store : Le respect des guidelines
![Page 1: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/1.jpg)
BIEN PASSER LE STORE
LE RESPECT DES GUIDELINESSachaLEROUX & AxelNEMETH
Design
![Page 2: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/2.jpg)
Design
SachaLEROUX (El conceptor)
PRO
Directeur des opérations Bewise by Ai3
Consultant Front-end
IL AIME
Tout ce qui possède une interface
Jouer à WoW avec des amis
Les meubles de designers super chers
qu’il ne peut pas payer
Les feux de bois quand il neige
@SachaLeroux
www.bewise.fr
![Page 3: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/3.jpg)
Design
AxelNEMETH (El designor)
PRO
Consultant Design & DA Bewise by Ai3
Spécialiste UI design et graphic design
IL AIME
Le sport (escalade, roller derby, VTT…)
La bonne bouffe
Les meubles et lampes de designers
super chers qu’il ne peut pas payer
Le cuir… sur des chaussures ou des vestes
@AxelNemeth
Behance.net/Axel-Nemeth
![Page 4: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/4.jpg)
Qui sommes-nous ?
22/04/2013 Société Ai34
Forte Culture
du Service
+120
AiCubiens
CA
2010 :
3,2M€
2011 :
5,8M€
2012 :
10M€
![Page 5: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/5.jpg)
CHAP1
LES
BASES
DE
MODERN
UI
Design
01CHAP2
LES
BASES
DE LA
CCU
02CHAP3
ERGO
DES
APPLIS
MODERN
UI
03CHAP4
GRAPHIC
DESIGN
04
![Page 6: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/6.jpg)
CHAP1LES BASES
DE MODERN UI
Design
![Page 7: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/7.jpg)
Design
Chrome : éléments visuels
permettant d’interagir avec
l’application
Consommation de contenus
Immersion totale
Attention à la productivité et la
création
CONTEN
T
BEFORE
CHROME
![Page 8: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/8.jpg)
1
2
![Page 9: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/9.jpg)
Design
Swiss Design
Existe depuis longtemps dans le
Typographique et minimaliste
Less is more, L. Mies Van Der Rohe
God is in the details, L. Mies Van Der
Rohe
FLAT
DESIGN
![Page 10: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/10.jpg)
All pictures are the property of their owners
![Page 11: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/11.jpg)
CHAP2LES BASES DE LA
CONCEPTION CENTREE
UTILISATEUR
Design
![Page 12: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/12.jpg)
Design
Philosophie et démarche
de conception , où les besoins, les
attentes et les caractéristiques
propres des utilisateurs finaux
sont pris en compte à chaque étape
du processus de développement
d'un produit
LA
CCU
![Page 13: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/13.jpg)
Design
Je ne suis pas un bon exemple
d’utilisateur
Quelle est ma cible ?
Qui sont mes utilisateurs ?
Qu’aiment-ils ?
Qu’attendent-ils ?
L’utilisateur final est-il mon client ?
VOS
UTILISA-
TEURS
![Page 14: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/14.jpg)
Design
Incertitude Certitude
Recherche Création - itérations Mise en œuvre
* Représentation de Damien Newman - Central
![Page 15: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/15.jpg)
CHAP3L’ERGONOMIE
DES APPS MODERN UI
Design
![Page 16: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/16.jpg)
Design
Comprendre vos utilisateurs
Mock-up
Créer des scenarios d’utilisations
L’ERGO DE
VOTRE
APPLI
![Page 17: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/17.jpg)
Design
TYPES DE
PAGES
![Page 18: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/18.jpg)
Design
HUB &
SPOKE
![Page 19: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/19.jpg)
Design
FONCTIONS PRINCIPALES &
SECONDAIRES
![Page 20: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/20.jpg)
Design
NAVIGATION TABULAIRE
![Page 21: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/21.jpg)
Design
NAVIGATION VIA APP BAR
![Page 22: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/22.jpg)
Design
RACCOURCIS VERS CHARMS
![Page 23: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/23.jpg)
Design
OUBLI DE LA SNAP VIEW !
![Page 24: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/24.jpg)
Design
PAS D’INDICATION DE LA NAVIGATION
![Page 25: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/25.jpg)
Design
HOME PAGE ‘MENU’
![Page 26: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/26.jpg)
Design
LANDING PAGE INUTILE
![Page 27: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/27.jpg)
Design
ZONES ET PAGES VIDES
![Page 28: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/28.jpg)
Design
![Page 29: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/29.jpg)
Design
![Page 30: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/30.jpg)
![Page 31: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/31.jpg)
![Page 32: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/32.jpg)
Design
PERSONNALISATION DE L’EXPERIENCE
![Page 33: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/33.jpg)
Design
RESPONSIVE
DESIGN
![Page 34: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/34.jpg)
Design
Souris + clavier
Utiliser les charms
Homogénéiser l’expérience avec l’OS
Roaming
Pas de scroll dans trop d’éléments
Résolution et DPI
Fast and fluid + feedback
POINTS
IMP.
![Page 35: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/35.jpg)
CHAP4GRAPHIC DESIGN
Design
![Page 36: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/36.jpg)
Design
Partie visuelle de la création
Pas au « petit bonheur la chance »
Cible utilisateur / Placement produit
Trending
FCM
Intégration/dév
C’EST
QUOI ?
![Page 37: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/37.jpg)
Design
SIMPLE
SESTHETIQUE
EMEMORISABLE
MUNIQUE
UINTEMPOREL
I
![Page 38: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/38.jpg)
Design
![Page 39: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/39.jpg)
Design
Branding
Identification visuelle de votre appli
Doit respecter la règle SEMUI
Un logo n’est pas une photo une
icône…
VOTRE
LOGO
![Page 40: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/40.jpg)
Design
![Page 41: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/41.jpg)
Design
![Page 42: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/42.jpg)
Design
Hiérarchisation visuelle
Evite la monotonie
Facilite la lecture
FOCUS
VISUEL
![Page 43: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/43.jpg)
Design
VISUEL VISUEL VISUEL VISUEL VISUEL VISUEL
VISUEL VISUEL VISUEL VISUEL VISUEL VISUEL
VISUAL VISUEL VISUEL VISUEL VISUEL VISUEL
![Page 44: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/44.jpg)
Design
VISUEL
VISUEL VISUEL
VISUEL VISUEL VISUEL
VISUEL
VISUEL VISUEL
VISUEL
VISUEL
VISUEL VISUEL VISUEL VISUAL
![Page 45: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/45.jpg)
Design
VISUEL VISUEL VISUEL VISUEL VISUEL VISUEL
VISUEL VISUEL VISUELVISUELFOCUSVISUEL
VISUEL
VISUEL VISUEL VISUEL VISUEL VISUAL VISUEL
![Page 46: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/46.jpg)
Design
Pas trop de couleurs
Camaïeux
Couleurs complémentaires
Pas de RVB en extrême
(Valeur à 255 ou 0)
https://kuler.adobe.com/#
LES
COULEURS
![Page 47: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/47.jpg)
Design
Attention au Serif
Jamais de 4 polices
Privilégier la simplicité
ToUjours le Même CHOIX
poUR la casSE
LES
POLICES
![Page 48: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/48.jpg)
Design
![Page 49: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/49.jpg)
Design
Recouper avec les valeurs de
l’application
Décliner le style sur différents écrans
APPLI
FINALE
![Page 50: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/50.jpg)
Design
![Page 51: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/51.jpg)
Design
![Page 52: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/52.jpg)
Design
![Page 53: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/53.jpg)
Design
Content before chrome0
1
Hub & Spoke02
Charms & App bar03
Responsive Design04
Grid Design05
White Space06
Typographie07
Branding08
Flat Design09
Utilisateur10
![Page 54: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/54.jpg)
Donnez votre avis !
Depuis votre smartphone, sur :
http://notes.mstechdays.fr
De nombreux lots à gagner toutes les heures !!!
Claviers, souris et jeux Microsoft…
Merci de nous aider à améliorer les TechDays
http://notes.mstechdays.fr
![Page 55: Bien passer le Store : Le respect des guidelines](https://reader033.fdocuments.net/reader033/viewer/2022052909/559976941a28ab2b528b457b/html5/thumbnails/55.jpg)
Formez-vous en ligne
Retrouvez nos évènements
Faites-vous accompagner
gratuitement
Essayer gratuitement nos
solutions IT
Retrouver nos experts
Microsoft
Pros de l’ITDéveloppeurs
www.microsoftvirtualacademy.comhttp://aka.ms/generation-app
http://aka.ms/evenements-
developpeurshttp://aka.ms/itcamps-france
Les accélérateurs
Windows Azure, Windows Phone,
Windows 8
http://aka.ms/telechargements
La Dev’Team sur MSDN
http://aka.ms/devteam
L’IT Team sur TechNet
http://aka.ms/itteam