Le téléchargement de votre SlideShare est en cours. ×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Design Windows 8: Retours d'expérience

120

Published on

Les enjeux du développement graphique sur les plateformes Microsoft : retours d’expérience sur le client … ou comment réussir un design en évitant les écueils techniques et structurels du schéma de ...

Les enjeux du développement graphique sur les plateformes Microsoft : retours d’expérience sur le client … ou comment réussir un design en évitant les écueils techniques et structurels du schéma de production pour Windows 8.

Published in: Technologies
0 commentaires
0 mentions J'aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Be the first to like this

Aucun téléchargement
Vues
Total des vues
120
Sur Slideshare
0
À partir des ajouts
0
Nombre d'ajouts
0
Actions
Partages
0
Téléchargements
4
Commentaires
0
J'aime
0
Ajouts 0
No embeds

Signaler un contenu
Signalé comme inapproprié Signaler comme inapproprié
Signaler comme inapproprié

Indiquez la raison pour laquelle vous avez signalé cette présentation comme n'étant pas appropriée.

Annuler
No notes for slide
  • Intro session Windows 8, generale ou design (supprimer la mention inutile). Ne pas modifier ce template. Choisissez plutôt une slide d’intro pour votre sujet et supprimez les autres.
  • Créé en 20082,5 ans avec MicrosoftPartenaire de IE9 : NevermindthebulletsMembre de l’app circle, travail sur Windows 8 depuis janvier 2012
  • On reconnait de suite une app Windows 8
  • Exemple d’app Windows 8
  • Exemple d’app Windows 8
  • Exemple d’app Windows 8
  • Exemple d’app Windows 8
  • Exemple d’app Windows 8
  • Exemple d’app Windows 8
  • Pas d’habillage superflu, juste du contenuToutes tailles d’écrans, s’adapte a la taille de l’écranHiérarchie des infos par taille de typo, jouer sur les fonts peut vaoriser un designToutes les apps : machent par Tuiles, les commandes sont dans la commande bar, le partage se fait en charm, la recherche dans le charm rechercheTactile par défaut, premier OSFlat design ?
  • .
  • Coincidence ?
  • Consécration
  • Le flatdesign touche le monde
  • Meme google, meme Apple
  • Le skeuomorphisme et l`approche authentiquement numérique de Microsoft (DES208)
  • 2 pièges classiques
  • Interdit de mettre un champs de recherche in-app
  • Ca a été interdit,Puis finalement authorisé, grace au pouvoir du peuple
  • Interdit de mettre des éléments sous la fleche
  • On peut mettre des éléments en topMais jamais à gauche, sauf au scrolll biensur
  • Exemple de page image
  • Pas de contenu frais, pas de nouveautéDonc de grandes belles tuiles pour habiller l’espace
  • Chaque thématique a son fond photo dédié, immersion
  • Pas de pagination, infinite scrollMais des milestone, en sections
  • Ou en Zoom semanticZoom semantic : meme contenu, display simplifiéCe n’est pas un autre contenu
  • Exemple de page image
  • Tuiles photos,Le fond noir les fait ressortir, bonne pratique
  • Agréagateur, besoin de lire vite, scroll verticale, reprise du template « settings »
  • Industrialisation
  • Industrialisation
  • Identité marque : la ligne de biais
  • Identité marque : header de biaisPetit détail qui marque bien l’indentité
  • 3 sectionsTuiles hautes cliquablse pour entrer dans l’universTuiles spécifiques par sections avec accès directe aux infos
  • Julienmonte sur le stage
  • Présentation par Julien
  • On peut afficher sur le meme écran des graphs, des chiffres, du texte, chacun dans une tuiles séparés
  • Vert : DatasRose : clients
  • Transcript

    • 1. Retours d’expérience,Design Windows 8François LE PICHONDirecteur de créationSteaw & WaestDesign@iamstarkhttp://steaw-webdesign.com
    • 2. A PROPOSDesign
    • 3. Design• Studio de création, 2008• HTML5 : NeverMindTheBullets.com IE9• Windows 8 : Beta Janvier 2012, AppCircleSteaw
    • 4. UNE IDENTITE FORTEDesign Windows 8Design
    • 5. LES GRANDS PRINCIPESDesign Windows 8Design
    • 6. Design• Content before Chrome• Responsive• Typographique• Expériences unifiées• Touch-Ready• Flat DesignWindows 8 Design
    • 7. FLAT DESIGN ?Petite parenthèseDesign
    • 8. Design• La tendance 2013• Simplification desformes• Colorée, simple,accessible• Tendance Web etMobileFlat Design !
    • 9. Design
    • 10. DesignPrécurseur ?
    • 11. DesignOct 2010Fun factsMicrosoft lance Windows Phone 7, le premier OS enFlat DesignBUILD, Microsoft dévoile Windows 8 : Flat DesignNouvelle identité pour Google : Flat DesignDébut des critiques sur le skeuomorphismSmashing Mag publie sur le Flat DesignWindows 8 ressort dans chaque articleSept 2011Dec 20112012Oct 2012Bonus
    • 12. DesignThe lack of skeuomorphic effects and almostextreme flatness of the “modern” (née Metro)Windows 8 interface is remarkably forward-thinking.Daring Fireball18/01/2013
    • 13. Design2012
    • 14. Design
    • 15. DesignNous sommes/entrons dans la „‟Flat Design Era‟‟Windows 8 = Flat Design = Windows 8Pour résumerA 16h avec Michel RousseauPour aller plus loin
    • 16. RETOURS D’EXPÉRIENCEFermons la parenthèseDesign
    • 17. Design• Généralités• Larousse• News Republic– Appy Geek• Boursorama• SageExpériences
    • 18. Design• Recherche• MargesGénéralités
    • 19. DesignCherchez l’erreur
    • 20. DesignUtiliser le Charm Search
    • 21. DesignUtiliser le Charm Search
    • 22. DesignCherchez l’erreur
    • 23. DesignRespecter les marges
    • 24. Design• Dictionnaire• Hub très visuel• Photographies• Infinite (Square)Scroll• Zoom semanticsLarousse
    • 25. DesignHub très visuel, hautes tuiles
    • 26. DesignPhotographies
    • 27. DesignInfinite (Square) Scroll - Horizontal
    • 28. DesignSemantic Zoom - Utile et pertinent
    • 29. Design• Agrégateur• Tuiles photos• Dual Scroll• Appy GeekNews Republic
    • 30. DesignTuiles en image – Fond sombre
    • 31. DesignDouble Scroll Vertical – Lecture Rapide
    • 32. Design1 layout = 2 apps
    • 33. Design1 layout = 2 apps
    • 34. Design• Banque, Bourse,Actualités• Identité marque• Hub très riche• Ambiance parsecteurBoursorama
    • 35. DesignIndentité Marque
    • 36. DesignIndentité Marque
    • 37. DesignHub riche – Sections riches et dynamiques
    • 38. DesignHub riche – Sections dynamiques
    • 39. DesignInvité :Julien VANIERESage
    • 40. Design• Présentation• L’utilité des tuiles• Codes couleurs• Intuitivité• Double scrollingSage
    • 41. DesignJulien ?Présentation de Better ClientsTes impressions sur Windows 8
    • 42. DesignIntuitivité du scroll horizontal ?
    • 43. DesignAfficher facilement un contenu hétéroclite
    • 44. DesignCodes couleurs – Identification rapide
    • 45. DesignDouble Scroll – Cas complexe
    • 46. MERCIFrançois LE PICHONDirecteur de créationSteawDesign@iamstarkhttp://steaw-webdesign.com

    ×