Différences entre versions de « Développement professionnel/Pensée conceptuelle/Prototypage de logiciels et outils »
m |
m |
||
Ligne 68 : | Ligne 68 : | ||
Assurez-vous que lorsque vous concevez votre interface utilisateur pour des clients ayant des <u>besoins d'accessibilité</u>, vous prenez en compte les couleurs que vous utilisez. | Assurez-vous que lorsque vous concevez votre interface utilisateur pour des clients ayant des <u>besoins d'accessibilité</u>, vous prenez en compte les couleurs que vous utilisez. | ||
− | * [http://colorsafe.co/ Ce site Web] basé sur les directives d'accessibilité du contenu Web (WCAG) est une excellente ressource suggérée par un client qui travaille dans le domaine de l'accessibilité! | + | *[http://colorsafe.co/ Ce site Web] et [https://webaim.org/resources/contrastchecker/ ce site Web] basé sur les directives d'accessibilité du contenu Web (WCAG) est une excellente ressource suggérée par un client qui travaille dans le domaine de l'accessibilité! |
− | * [https://accessibility.blog.gov.uk/2016/09/02/dos-and-donts-on-designing-for-accessibility/ Ce site Web] contient également de superbes infographies sur les choses à faire et à ne pas faire sur la conception pour différents groupes d'accessibilité. | + | *[https://accessibility.blog.gov.uk/2016/09/02/dos-and-donts-on-designing-for-accessibility/ Ce site Web] contient également de superbes infographies sur les choses à faire et à ne pas faire sur la conception pour différents groupes d'accessibilité. |
− | * [http://www.sussex.ac.uk/tel/resource/tel_website/accessiblecontrast/?q=FFFFFF~003b49~1d4289~94a596~e56db1~d3273e~00bfb2~d6d2c4~ffc845~dc582a~41b6e6~1b365d~be84a3~5d3754~7da1c4~f2c75c~d0d3d4~007a78~000000 Cette page de l'Université du Sussex] avec quelques couleurs préchargées peut également être un outil très utile pour cela. Remarquez comment [http://www.sussex.ac.uk/tel/resource/tel_website/accessiblecontrast/?q=8f001a~ffffff la couleur de fond officielle de l'Université d'Ottawa se marie bien avec le texte blanc]. | + | *[http://www.sussex.ac.uk/tel/resource/tel_website/accessiblecontrast/?q=FFFFFF~003b49~1d4289~94a596~e56db1~d3273e~00bfb2~d6d2c4~ffc845~dc582a~41b6e6~1b365d~be84a3~5d3754~7da1c4~f2c75c~d0d3d4~007a78~000000 Cette page de l'Université du Sussex] avec quelques couleurs préchargées peut également être un outil très utile pour cela. Remarquez comment [http://www.sussex.ac.uk/tel/resource/tel_website/accessiblecontrast/?q=8f001a~ffffff la couleur de fond officielle de l'Université d'Ottawa se marie bien avec le texte blanc]. |
+ | *[https://www.color-blindness.com/coblis-color-blindness-simulator/ Ce site Web] permet de téléverser une image et de le voir à travers les yeux de quelqu'un qui est daltonien. | ||
Voici une liste de plateformes qui exige de <u>l'expérience minimale de programmation</u> à utiliser: | Voici une liste de plateformes qui exige de <u>l'expérience minimale de programmation</u> à utiliser: |
Version du 13 août 2021 à 15:55
Beaucoup d'entre nous (AEs/GPs et étudiants) ont du mal avec le concept de test de logiciel ou simplement avec la façon de prototyper un logiciel. C'est moins concret que le prototypage physique et il est plus difficile de comprendre. Vous pourriez dire que vous ne pouvez pas tester ou prototyper quelque chose parce que c'est un logiciel... détrompez-vous!
Nous allons le comparer à un cycle de conception mécanique typique (sans tenir compte de l'implication du client):
Étape de conception | Mécanique | Logiciel |
Conception conceptuels | Croquis dessinés à la main/ordinateur | Croquis dessinés à la main/ordinateur |
Conception preliminaire | Assemblages CAO initiaux | Conceptions filaires (wireframe)/organigramme |
Conception détaillée | CAD entièrement défini | Schéma haute fidélité/Logiciel codé initial |
Simulation/ test | Simulations de force/ fluide CAO | Simulation UX |
Prototype 1 | Pièce(s) fabriquée(s) | Logiciel codé fonctionnel |
Tests raffinés | Test sous charge par rapport aux métriques | Sous-fonctions pour tester le comportement de fonctionnalités spécifiques par rapport aux métriques |
Dans nos classes GNG1503/2501, le cycle est un peu différent là où vous pourriez avoir:
Étape de conception | Mécanique | Logiciel |
Dessins conceptuels | Croquis dessinés à la main | Croquis dessinés à la main |
Conception détaillée | Croquis détaillés des sous-ensembles avec quelques analyses | Conceptions filaires (wireframe)/organigramme |
Prototype 1 | Prototype en carton | Schéma haute fidélité/ Logiciel codé initial |
Simulation / test | Test fonctionnel du prototype par rapport aux métriques | Simulation UX par rapport aux métriques |
Prototype 2/3 | Prototype assemblé et fonctionnel | Logiciel fonctionnel |
Partage
Lorsque vous travaillez en équipe, vous voudrez certainement partager vos fichiers pour travailler ensemble. En mécanique, GrabCad Workbench est un outil populaire, mais dans le logiciel, GitHub est définitivement un standard de l'industrie.
Voici une introduction à GitHub https://rogerdudler.github.io/git-guide/index.fr.html
Outils
Voici une liste d'outils de prototypage UI et UX qui pourraient être utiles et sont très facile à utiliser: https://blog.prototypr.io/top-20-prototyping-tools-for-ui-and-ux-designers-2017-46d59be0b3a9 (Figma, Balsamiq et Adobe XD sont suggérés qui sont gratuits ou gratuit pour étudiants)
Assurez-vous que lorsque vous concevez votre interface utilisateur pour des clients ayant des besoins d'accessibilité, vous prenez en compte les couleurs que vous utilisez.
- Ce site Web et ce site Web basé sur les directives d'accessibilité du contenu Web (WCAG) est une excellente ressource suggérée par un client qui travaille dans le domaine de l'accessibilité!
- Ce site Web contient également de superbes infographies sur les choses à faire et à ne pas faire sur la conception pour différents groupes d'accessibilité.
- Cette page de l'Université du Sussex avec quelques couleurs préchargées peut également être un outil très utile pour cela. Remarquez comment la couleur de fond officielle de l'Université d'Ottawa se marie bien avec le texte blanc.
- Ce site Web permet de téléverser une image et de le voir à travers les yeux de quelqu'un qui est daltonien.
Voici une liste de plateformes qui exige de l'expérience minimale de programmation à utiliser:
- MIT app inventor (applications android seulement)
- Thunkable (applications android et iOS)
- Wix (siteweb)
- Microsoft Power Apps (android, iOS et windows)
Voici une liste de sitewebs avec du syntax de code et des bibliothèques utiles qui peuvent vous aider à commencer:
- W3 Schools (HTML, CSS, JavaScript, SQL, PHP et plus!)
Voici une liste d'autres plateformes pour construire des applications ou sitewebs qui exigent plus d'expérience en programmation pour utiliser: