THE BLOG

30
Nov

Arzhur Caouissin Interview

Qu’est-ce que le digital publishing ?

Arzhur Caouissin est formateur expert dans les domaine de la publication numérique et de l'animation pour le Web et les plateformes mobiles.Arzhur Caouissin : Le digital publishing, ou en français l’édition numérique, comprend l’ensemble des moyens qui permettent de publier sur les plateformes mobiles un contenu éditorialisé. C’est une tendance qui consiste à rassembler le meilleur du print et du web dans un environnement dédié que sont la tablette et le smartphone. Du print, on hérite de la culture du signe, souvent absente du Web jusqu’en 2010. Et du Web, on hérite de l’interactivité.

Le Web propose justement de belles prestations graphiques et interactives aujourd’hui grâce à l’avènement de sites responsives et HTML5 (voir thefwa.com). Qu’apporte vraiment une édition numérique de si singulier ?

AC :L’immersion ! Il n’est pas possible de contempler une réalisation richmédia de manière totalement décontractée quand on reste penché sur un clavier, une souris, et immobilisé par des connectiques en tous genres (imprimantes, câbles divers, palette graphique, haut-parleurs…). La tablette ou le smartphone permettent une meilleure concentration et offrent une proximité inédite, à la fois par le fait de tenir l’écran directement entre les mains tout en restant vautré dans son canapé (20% des usages), mais aussi par le contact physique avec l’image. C’est le support idéal pour les reportages de fond que l’on ne prend pas le temps de lire sur le Web et pour les placements de produits sous la forme de pages animées et ludiques, financées par les annonceurs.

Parle-t-on du même digital publishing pour un smartphone que pour une tablette ?

AC: Non. Un smartphone est avant tout mobile, localisable, compact. Sa vocation est d’informer ou de servir en mobilité. On y déploie d’abord des flux d’actualité ou des applications de service. La tablette reste un outil d’intérieur car elle se révèle peu lisible en extérieur, relativement encombrante et convoitée. Elle apparaît donc plus immersive encore que le smartphone ou la phablette. On ne doit pas y déployer les mêmes contenus. Le concept du magalogue, par exemple, fait des émules sur la tablette. C’est un magazine éditorial et marchand, contenant des vidéos qui aboutissent à des achats intégrés.

Quid des liseuses ?

AC: Leur offre est également complémentaire. Elle se concentre ici sur du contenu texte. La technologie des liseuses, basée sur de l’encre numérique, permet une lecture en plein soleil et offre une grande autonomie (jusque 1 mois).

Les usages digitaux se fragmentent. Comment doit-on aborder le digital sans s’y perdre ?

AC: Il est plus que nécessaire de songer à la véritable nature de son projet. On ne produit pas du digital pour être digital en répliquant un PDF sur tous les supports. Cela n’apporte rien et rendra votre projet inutile et inintéressant, au mieux. Il nuira gravement à votre image et vous coûtera, au pire (200 millions de dollars perdus pour The daily, en 2012). Vous devez absolument imaginer ces supports comme complémentaires des autres. Pourquoi diable achèterais-je un shampoing et un après-shampoing si je peux avoir les deux en un ? En vous interdisant de tout faire sur un support, vous offrez plus d’attrait à chaque déclinaison de votre marque sur chaque canal de communication.

Comment monétiser un projet ? Est-ce viable ? Qui achète un magazine numérique ?

AC: Il faut rester lucide et honnête. La bulle du digital se termine (-8% des ventes de tablettes en 2015). Mais on sait maintenant ce qui est viable sur ce support. De 2007 à 2012, on a vu des projets se déployer avec l’idée que nous les achèterions d’un simple tap dans les stores corrélés à notre numéro personnel de carte bleue (même sottise que ce que le Web a promis en 1999). Et à part quelques rares succès, vendre un mag sur tablette ne marche pas. Ce qui paye, ce n’est pas la vente, mais le bénéfice en terme d’expérience utilisateur que peut obtenir une grande marque, un groupe d’assurance, un cinéma, un magazine télé, un commerce, un voyagiste, un musée, une agence immobilière, une université. Soit vous apportez un service qui permet, par le digital, d’obtenir une économie d’échelle sur de l’impression papier (communication pour les grands groupes), soit vous valorisez une parution ou une marque traditionnelle par un contenu plus animé. Donc, il y a de vrais débouchés, mais ce n’est pas forcément dans la presse qu’on les trouvera, plutôt dans la communication d’entreprise et de marques. Certaines marques internationales et localisées en France recrutent des centaines de personnes pour développer des pôles internes dans le secteur du digital. C’est dire.

On y voit plus clair sur les usages. Mais quels outils choisir ? Quelle différence entre iBooks, Aquafadas et PandaSuite ?

AC: Aquafadas s’impose comme la solution la plus adaptée à la création de magazines et de périodiques enrichis, grâce à sa grande expérience dans le secteur de la presse et de l’édition. Elle possède des enrichissements adaptés pour du magazine, avec des modules clé-en-main comme des jeux de puzzle, le sudoku, des labyrinthes. Mais on peut aussi créer des éditions plus personnalisables directement à partir de l’environnement de travail adossé à InDesign et de contenus HTML5.

PandaSuite est une solution qui offre une approche centrée sur les médias. C’est un outil connecté dédié et indépendant, lui, de InDesign. On y importe ses médias et on monte de toute pièce une application interactive basée sur des contenus à forte valeur ajoutée graphique. On peut, par exemple,synchroniser des comportements avec un timecode précis sur une vidéo ou la faire défiler en fonction du degré d’inclinaison de la tablette. C’est un truc de malade ! C’est, sans coder et en natif, ce que l’on faisait autrefois exactement dans Flash, en codant et au format SWF. C’est donc la solution idéale pour impacter et créer des applications événementielles. L’offre démarre à 100€ pour un mois, sans engagement aucun. Une aubaine pour les agences de com.

iBooks, bien que très séduisant pour la facilité de sa prise en main (logiciel Apple gratuit et Wysiwyg), ne permet de publier que de l’epub3 pour iOS. Si votre but est donc de diffuser au plus grand nombre ou dans un format natif robuste, mieux vaut rester sur les deux premières solutions. iBooks en revanche conviendra aux petits budgets qui cherchent à expérimenter le support iPad avant peut-être de se professionnaliser avec les autres solutions qui exportent, elles, en plus, vers Android et le Web. iBooks peut constituer bonne entrée en matière, en somme.

07
Sep

44 pixels n’est pas une valeur fiable !

44 pixels n’est pas une valeur fiable !

Même s’il y a bien moins d’appareils sous iOS que sous Android, la recommandation d’Apple reste le standard : pas de cible de moins de 44 pixels. Sauf que ce n’est pas une mesure physique. De plus, du fait des différences de systèmes d’exploitation et de la décision d’Apple de convertir les pixels en une valeur indépendante des caractéristiques de l’appareil (un « point »), ces 44 pixels ne peuvent pas être convertis en une seule et même taille physique.

Pourtant c’est bien la taille qui compte, et toutes les bonnes recommandations donnent des mesures en millimètres, en pouces, en points typographiques et autres unités concrètes.

Par ailleurs, un grand nombre de recommandations destinées aux systèmes d’exploitation et aux équipementiers informatique (OEMs) préconisent des dimensions pour les cibles tactiles qui sont bien inférieures aux valeurs minimum relevées dans la vaste majorité des études sur le sujet. Nokia, par exemple, répète à l’envi que 7mm est une cible tout ce qu’il y a de plus adaptée pour tactile, et Microsoft leur emboîte joyeusement le pas, en ajoutant que 2mm suffisent largement pour séparer 2 cibles. Les autres recommandations sont tout aussi farfelues et incohérentes entre elles. ANSI/HFES 100–2007 préconise par exemple que les boutons ne fassent pas moins de 9,5mm. (…)
1671741-inline-contact-sizes

Faut-il prendre en compte la taille des différents doigts?

La norme ISO 9241–9 prend le problème un peu différemment et recommande que les boutons mesurent au minimum la largeur maximum de la dernière phalange de l’index de 95% de la population mâle, soit environ 22mm ! Mais énormément de gens utilisent les écrans tactiles avec le pouce.

Un grand nombre de recommandations se basent sur la largeur d’un doigt mais cette mesure est peu applicable en pratique car on ne touche pas un écran capacitif avec toute la largeur du doigt, comme l’illustre le schéma suivant. (…)

01

Vous serez peut-être surpris d’apprendre que les écrans tactiles actuels ne détectent pas la surface de contact entière mais seulement le centre géométrique, ou barycentre, comme l’indique la figure 2. Les téléphones, et donc a fortiori les applications et sites web, ne peuvent pas connaître la superficie de la zone de contact car l’écran ne leur fournit pas cette information. Les appareils ne pouvant se baser que sur le barycentre de la zone de contact, les dimensions de cette dernière n’ont donc aucune importance.

02

Les gros boutons sont plus faciles à utiliser – mais sans exagérer

(..) Plusieurs études ont démontré que la précision des interactions tactiles cesse d’augmenter à partir d’un certain seuil, et que ce seuil est bien plus bas qu’on ne s’y attend. Quand les boutons sont trop grands, les utilisateurs ont du mal à les voir comme cliquables, voire même à les interpréter comme des boutons.

Le mythe des gros boutons révèle également une croyance incorrecte, qui est que la zone cliquable devrait correspondre à la partie visible des cibles. C’est bien souvent le cas en pratique, mais cette croyance provoque néanmoins de nombreux problèmes de design. En pratique, augmenter la taille d’une cible n’implique pas nécessairement d’augmenter la partie visible d’un bouton. Il est souvent bien plus simple d’augmenter la zone cliquable autour des boutons ou des liens.

Comme pour tout élément interactif, les zones visibles et cliquables peuvent être différentes, et le plus souvent elles doivent l’être.

Dessiner des cibles

Quand on conçoit une interface tactile, il est primordial de comprendre et prévoir les trois aspects suivants pour chaque cible :

  • les cibles visuelles ;
  • les zones réactives ;
  • les zones d’interférences.

Les cibles visuelles

Les cibles visuelles correspondent aux textes, icônes ou autres éléments graphique indiquant qu’une interaction est possible. Elles doivent être assez grandes et lisibles pour :

  • Attirer le regard de l’utilisateur ;
  • Indiquer clairement leur interactivité ;
  • Être lisibles, et indiquer sans ambigüité le résultat de leur action ;
  • Montrer à l’utilisateur qu’il peut facilement les déclencher.

(…) Plus que la taille de police, c’est l’angle de vue qui influence la lisibilité, on parle alors de pouvoir de résolution. Dans la figure 3, le cône le plus étroit représente la taille minimum pour que du texte soit lisible. Il se situe dans un cône plus large qui correspond à la zone de haute résolution où se concentre le regard. Les appareils tenus à plus grande distance nécessitent une plus grande taille de texte.

La taille de police doit faire en sorte que les caractères et les mots soient lisibles et faciles à cliquer. Les calculs de résolution et de distance montrent qu’une police cesse d’être lisible en dessous de 6 points, soit 2,1mm. Les icônes ne doivent quant à elles pas mesurer moins de 8 points, soit 2,8mm, à moins qu’elles ne viennent en complément de texte (comme par exemple un indicateur d’ouverture dans une nouvelle fenêtre). Ces mesures sont à augmenter pour les utilisateurs ayant des problèmes de vue. (…)

Concevoir des zones réactives

Les zones de l’écran que l’utilisateur peut toucher pour déclencher une action sont les cibles tactiles. Le contact avec l’écran en dehors de toute cible tactile n’a aucun effet. (…) Vu que les écrans tactiles ne détectent que le barycentre de la zone de contact, cette dernière n’est pas aussi déterminante que l’on s’y attend pour sélectionner la cible visée.

04

Les liens textes sont bien trop petits pour être facilement atteints. Certains des navigateurs et systèmes d’exploitations modernes tels que Google Chrome tentent de résoudre ce problème en effectuant un zoom sur les petites cibles ambiguës, afin que les zones cibles soient suffisamment grandes. (…)

Les zones d’interférences

(…) L’interférence, qui se produit quand les zones de probabilité d’erreur de deux éléments se recouvrent, est l’erreur pouvant avoir les plus graves conséquences.

Assurez-vous qu’aucune interférence n’est possible, dans les axes horizontaux et verticaux. Pour cela, assurez-vous de laisser au moins 8mm d’écart depuis le centre, et d’aller jusqu’à 10mm partout où c’est possible. « Depuis le centre » est un terme technique qui signifie que les distances sont calculées depuis le centre de chaque cible tactile. Ce type de mesure permet de s’affranchir des différences entre le type de cible, qu’elles soient visuelles ou tactiles, ou de taille différente. (…)

Concevoir les gestes et mouvements

(…) Par exemple, concevoir un curseur pour le volume facile à utiliser a clairement les mêmes contraintes basiques d’interaction pour ce qui est d’appuyer et de maintenir l’appui sur la cible. Mais d’autres considérations sont à prendre en compte dès que l’utilisateur déplace son doigt à l’écran pour ajuster la valeur. Plus particulièrement, il serait nécessaire de restreindre le mouvement à un seul axe, ou à un angle ou type de déplacement. Pour un curseur de volume horizontal, l’application devrait par exemple ignorer tout déplacement vertical une fois que l’utilisateur a commencé à interagir avec celui-ci. C’est un bon moyen pour permettre aux utilisateurs d’utiliser ce type d’éléments d’interfaces avec une grande précision. (…)

a

Sources

Article original : Common misconceptions about touch
Article complet en français : Écrans tactiles : mort aux mythes
Auteur : Steven Hoober

29
Juil

Pixate Studio prototype

Pixate Studio prototype maintenant vos apps gratuitement

s001
Comme l’annonce MacG, Pixate Studio, permettant de réaliser “des prototypes d’apps iOS et Android devient gratuit à l’issue de l’acquisition de son éditeur par Google. Pixate cite Apple, Disney, Snapchat, Amazon ou encore Uber parmi ses clients.”

What is it ?

Studio is used to create and edit prototypes. All prototypes are stored locally on your system and no internet connection is needed to preview your work. Pixate Studio is like other desktop applications, in regards to how you create and open files. Creating a new file or opening a file can be found on the Welcome to Pixate screen or through the File menu.
aaa

Pixate Studio also comes with samples you can open and experiment with. To open a sample, either choose one from the welcome screen or go to the File menu and choose New from Sample

Pixate is a next-generation mobile interaction design service aimed at helping designers create complex animations and interactions without writing code. The platform generates 100% native mobile prototypes as they’re being designed…

iOS simulator

Pixate offer native previews of prototypes, including an iOS simulator, just for this purpose.
s003

Interactions

Interactions are gestures and actions users will perform in your app. Adding an interaction to a layer, allows the user to tap, rotate or pinch the layer. Specific events of interactions are used to trigger animations.

  • DRAG : Moving an object with a finger
  • TAP : Touching and releasing in one motion
  • DOUBLE TAP : Touching and releasing, twice in a row
  • LONG PRESS : Touching and holding for an extended period of time and then releasing
  • ROTATE : Touching two fingers and turning clockwise or counter-clockwise
  • PINCH : Touching two fingers and pushing fingers together or pulling fingers apart
  • SCROLL : Moving a finger vertically or horizontally to scroll through content. Please note, scroll bounce is only supported on iOS devices. Android devices will not show scroll bounce.

zzz

Animations

Animations move, scale and change layers, depending on the interaction performed by the user and the properties you set up. These are linked to a specific event of an interaction, which can be something like tapping a layer or releasing a scroll.

  • MOVE : This animation moves a layer from one location to another. This can be one direction or a combination of X and Y movement.
  • SCALE : This increases or decreases the height and/or width of the layer.
  • ROTATE : This rotates the layer on the X, Y, and/or Z axis.
  • FADE : This changes the opacity of the layer.
  • COLOR : This changes the color of the layer. Currently this only displays an immediate change without transition.
  • IMAGE : This adds a specified image to the layer
  • REORDER : This moves the layer to the front or back or in front of or behind a specified layer.

29
Juil

Le Futur du Livre

Couv Salon le Futur du Livre

1ère édition du Salon “Le Futur du Livre” en septembre

A l’heure où les acteurs des métiers de l’édition s’interrogent sur l’avenir du livre numérique, ce salon permet de faire le point à la fois sur les technologies et sur les stratégies de développement du digital publishing, ainsi que de découvrir différents travaux et exemples de projets.

Ce salon se tiendra à Tours (50 minutes de Paris en TGV, alors venez, les Parisiens!), au sein de l’historique institut de Touraine, et accueillera des professionnels de toute la France le vendredi 11 septembre et sera ouvert au grand public le samedi 12 septembre.

Parmi les intervenants, on peut citer notamment Elisabeth Sutton d’IdBoox qui animera différentes tables rondes et conférences.

Différents travaux d’étudiants particulièrement réussis seront présentés, ainsi que plusieurs projets novateurs réalisés par des startups.

On peut noter aussi la participation d’Aquafadas et de PandaSuite, que vous pourrez rencontrer à cette occasion.

J’animerai pour ma part une conférence sur les points clés du développement d’un projet digital publishing.

Créer un tel évènement n’est pas chose facile… Mais nous pensons comme Emmanuel Roc, son créateur (et directeur de l’école Esten Sup’Edition), qu’il est important de contribuer à l’évolution de la culture du numérique en France, tant au niveau des professionnels qu’au niveau du grand public.

Le salon reçoit d’ailleurs le soutien du Syndicat National de l’Edition.

Je peux aussi vous annoncer sans vouloir trop “spoiler” que des innovations tout à fait passionnantes concernant l’ePub seront présentées en avant-première… Ainsi que différentes applications des technologies iBeacon, que nous savons ô combien stratégiques aujourd’hui.

Ce salon sera aussi l’occasion de rencontres dans un cadre agréable, et autour de quelques verres de Vouvray pour bien commencer l’année scolaire…!

Alors toute l’équipe d’Electriciens espère vous y voir, et souhaite bonne rentrée à cette première édition qui, on l’espère, en appellera d’autres.

background-programme

11
Juil

Les bébés apprendraient plus vite avec un iPad qu’avec un livre

IDBOOX

iPad_bebe_presse_numerique_tablette_IDBOOX
Les bébés apprendraient plus vite en utilisant une tablette qu’avec un livre entre les mains. C’est la conclusion d’une étude menée par Annette Karmiloff-Smith, qui est professeur, chargée de recherche au Centre for Brain and Cognitive Development de l’Université de Birkbeck. 

Selon elle, les parents devraient inciter les enfants à utiliser une tablette le plus tôt possible.
La scientifique explique : « «Ils apprennent si vite sur les tablettes … Il est choquant de constater à quelle vitesse ils maîtrisent, encore plus vite que les adultes pour faire des choses comme par exemple le défilement vers le haut et vers le bas du texte des livres »

A. Karmiloff-Smith poursuit : «Les livres sont statiques, lorsque vous observez les bébés avec des livres, tout ce qui les intéressent c’est le bruit des pages tournées. Leur système visuel à cet âge est attiré par le mouvement. Voilà pourquoi les contenus des tablettes, qui ont des photos et des sons, sont très bonnes pour eux ».

L’étude a été faite sur 36 bébés âgés entre 6 et 10 mois. Selon les chercheurs, les petits apprendraient trois plus vite avec une tablette qu’avec un livre.

Une enquête plus approfondie va être menée pour confirmer ces résultats, avec cette fois 100 bébés testeurs.

11
Juil

Une publicité interactive sur iPad qui sensibilise aux violences domestiques

L’IDÉE

Au Brésil, les violences domestiques subies par les femmes sont importantes. On compte en effet 5 femmes violentées toutes les deux minutes. Afin de sensibiliser à ce phénomène, l’association Maria da Penha Institute a collaboré avec l’agence F.biz. Une publicité interactive a été créée sur iPad, mettant en avant le visage d’une femme avec un texte. Ce dernier illustre les pensées de la jeune femme, qui raconte que son mari est rentré énervé du travail.

En secouant la tablette, le visage de la femme va devenir plus triste, et des blessures vont apparaître, comme si elle avait été frappée. Les mots vont également tomber, pour ne laisser que ces derniers : « I fell in the stairs » (je suis tombée dans les escaliers). Une façon originale de souligner l’importance de ne pas garder le silence lorsqu’on subit des violences domestiques.

L’AVIS

Une idée originale de sensibilisation qui montre que la publicité sur iPad offre des interactions intelligentes et impactantes. Une belle sensibilisation aux violences domestiques qui ne passera pas inaperçue.

VIDEO
11
Juil

Panda Suite : Comment le cloud optimise votre création d’application

 

PandaSuite a la tête dans les nuages mais ses pieds sont bien ancrés sur terre ! :-)

Contrairement à la grande majorité des solutions de création numérique, PandaSuite est un service SaaS (Software as a Service), c’est-à-dire un service en ligne, dans le cloud, auquel vous pouvez vous abonner sans engagement.

Vous le constatez dès votre première utilisation ! Nul besoin d’installer un logiciel sur votre ordinateur : en trois clics, vous accédez au studio de création dans votre navigateur !

Le cloud est un des points forts de PandaSuite : c’est grâce à cette technologie que vous vivez une expérience de création simple, fluide et qualitative sans avoir besoin de vous soucier de la technique. Votre application dispose ainsi du meilleur de la technologie et offre une qualité de rendu reconnue par les utilisateurs.

Découvrez ses principaux avantages :

– Accessibilité du contenu
Vous pouvez accéder à votre projet de n’importe où, n’importe quand et sur n’importe quel navigateur. Tout ce dont vous avez besoin, c’est du connexion Internet et de créativité !

– Indépendance
La nouvelle version Adobe CC 2015 vient à peine de sortir et c’est déjà la galère des mises à jour ! Aucun souci avec PandaSuite ! Les mises à jour du studio s’enchaînent sans pour autant nécessiter une action de votre part. Soyez attentif(ve) au numéro de version sous le logo PandaStudio : vous serez étonné(e) de le voir régulièrement s’incrémenter.

– Optimisation des medias
Peu connu encore, c’est pourtant l’un des principaux avantages du cloud. Toutes les images, sons et vidéos utilisés dans le studio de création sont encodés, convertis et compressés (si nécessaire) afin d’optimiser leur rendu en fonction du support utilisé et gagner en fluidité. Par exemple, si votre application est consultée sur un iPad Retina, les images utilisées seront deux fois plus grandes que pour un écran classique, sans pour autant que vous ayez téléchargé différents formats. Ne vous souciez plus de la technique, le cloud travaille pour vous !

– Vitesse d’exécution
Parce que vos contenus sont stockés sur le cloud, finie la compilation lorsque vous modifiez votre projet. Prévisualisez votre projet sur PandaViewer et mettez à jour votre application sur les stores instantanément : votre temps est précieux, consacrez-le à la création !

– Sécurité
Bien qu’elles se trouvent sur des serveurs distants, vos données sont parfaitement sécurisées et leur confidentialité est garantie grâce à l’utilisation d’un ensemble de ressources spécialisées sur ces enjeux.

Le cloud est donc votre compagnon invisible tout au long de votre processus de création, une sorte de botte secrète qui bénéfiera à votre application.

Nous sommes convaincus que le cloud forgera l’avenir des technologies en termes d’expérience utilisateur : nous avons déjà 1 000 idées sur comment l’exploiter techniquement.

Découvrez PandaSuite et adoptez la Cloud Attitude ! ;-)

11
Juil

Un mode ‘Design Space’ dans Photoshop CC2015

Elecric News
1200

MagG relève un nouveau mode de présentation dans Photoshop CC2015 : le Design Space. Il s’agit d’une Technologie Preview, et il faut donc aller dans les préférences de photoshop pour l’activer. Le plus étonnant est que cette interface Design Preview à été réalisée en HTML5 par ADOBE. Peu à peu, ADOBE oriente son logiciel vers la création d’interfaces, web et d’applications, avec de plus en plus de fonctions liées au HTML directement dans Photoshop.
Design Space
Design Space

Adobe prépare une nouvelle interface pour Photoshop, non pas pour remplacer l’existante (vous pouvez respirer à nouveau), mais pour une utilisation particulière. Cet éditeur d’images s’est depuis longtemps éloigné de son objectif original — modifier des photos, créer des montages… — pour devenir un outil à tout faire. En particulier pour créer des interfaces de sites ou d’applications et c’est justement ce point qui est concerné ici. (…) Le plus intéressant avec cette nouveauté n’est pas forcément visible toutefois. Adobe a réalisé l’ensemble de cette interface en HTML5 et le code utilisé est ouvert et disponible sur GitHub.(Source)

Photoshop Design Space

Design Space is a new way to use Photoshop. By combining the power of Photoshop with the flexibility of HTML5, Design Space provides a streamlined user interface to Photoshop and new experiences tailored just for design workflows. Design Space (Preview) is aimed at becoming a modern design experience inside Photoshop streamlined for the requirements of web, UX and mobile app designers. It’s an HMTL5/CSS/JS layer built on top of Photoshop. We’ve separated out standard Photoshop from the interface so that we can use this layer to create new UI, smarter interactions, and top-requested features.

Design Space is a work in progress. We’re still building essential features and experimenting with new ideas, and we want your help! Follow us on Twitter at @psdesign for updates from the team. If you find a bug or have an idea for a new feature, please help us by filing an issue. If you’re an adventurous developer, you can download and hack the HTML5 sources, and even submit pull requests.

Design Space (Preview) requires Mac OS X 10.10 or Windows 8.1 64-bit OS or higher and is currently displayed only in English.
Design Space

Photoshop : un mode simplifié pour créer des interfaces Photoshop Design Space (github.com) Design Space Development Setup FAQ Design Space (Preview)