From 6ee084aaef512480127b71fc182178090ff63a4c Mon Sep 17 00:00:00 2001 From: Agathe Pommery Date: Wed, 9 Mar 2022 17:49:19 +0100 Subject: [PATCH] update of formatting for ui audits --- subjects/ui/ui-1/ui-1-1/audit/README.md | 6 +- subjects/ui/ui-1/ui-1-10/audit/README.md | 14 +++-- subjects/ui/ui-1/ui-1-11/audit/README.md | 17 +++--- subjects/ui/ui-1/ui-1-2/audit/README.md | 12 ++-- subjects/ui/ui-1/ui-1-3/audit/README.md | 47 +++++++++++++--- subjects/ui/ui-1/ui-1-4/audit/README.md | 19 ++++--- subjects/ui/ui-1/ui-1-5/audit/README.md | 72 +++++++++++++++++------- subjects/ui/ui-1/ui-1-6/audit/README.md | 29 +++++----- subjects/ui/ui-1/ui-1-7/audit/README.md | 14 +++-- subjects/ui/ui-1/ui-1-8/audit/README.md | 16 +++--- subjects/ui/ui-1/ui-1-9/audit/README.md | 18 +++--- subjects/ui/ui-2/ui-2-1/audit/README.md | 12 ++-- subjects/ui/ui-2/ui-2-2/audit/README.md | 12 ++-- subjects/ui/ui-2/ui-2-3/audit/README.md | 12 ++-- subjects/ui/ui-2/ui-2-4/audit/README.md | 24 ++++---- subjects/ui/ui-2/ui-2-5/audit/README.md | 24 ++++---- subjects/ui/ui-3/ui-3-1/audit/README.md | 16 ++++-- subjects/ui/ui-3/ui-3-10/audit/README.md | 10 ++-- subjects/ui/ui-3/ui-3-11/audit/README.md | 10 ++-- subjects/ui/ui-3/ui-3-2/audit/README.md | 8 +-- subjects/ui/ui-3/ui-3-3/audit/README.md | 8 ++- subjects/ui/ui-3/ui-3-4/audit/README.md | 10 ++-- subjects/ui/ui-3/ui-3-5/audit/README.md | 10 ++-- subjects/ui/ui-3/ui-3-6/audit/README.md | 10 ++-- subjects/ui/ui-3/ui-3-7/audit/README.md | 10 ++-- subjects/ui/ui-3/ui-3-8/audit/README.md | 10 ++-- subjects/ui/ui-3/ui-3-9/audit/README.md | 10 ++-- subjects/ui/ui-4/ui-4-1/audit/README.md | 12 ++-- subjects/ui/ui-4/ui-4-2/audit/README.md | 16 +++--- subjects/ui/ui-4/ui-4-3/audit/README.md | 4 +- subjects/ui/ui-4/ui-4-4/audit/README.md | 12 ++-- subjects/ui/ui-4/ui-4-5/audit/README.md | 12 ++-- subjects/ui/ui-5/ui-5-1/audit/README.md | 8 ++- subjects/ui/ui-5/ui-5-2/audit/README.md | 8 ++- 34 files changed, 338 insertions(+), 194 deletions(-) diff --git a/subjects/ui/ui-1/ui-1-1/audit/README.md b/subjects/ui/ui-1/ui-1-1/audit/README.md index 1c10f46..61ab09a 100644 --- a/subjects/ui/ui-1/ui-1-1/audit/README.md +++ b/subjects/ui/ui-1/ui-1-1/audit/README.md @@ -1,4 +1,4 @@ -#### Functional +#### Audit instructions ##### Make sure that: @@ -6,4 +6,6 @@ ###### The colors match with the ones from the screens? -##### Here below is a link of example of correction key [Exercise completed](https://www.figma.com/file/bQsRIJoJYK5b8WAxXFeOfv/UI-I---Ex-1?node-id=0%3A1) +##### Here below is a link of example of correction key + + [Exercise completed](https://www.figma.com/file/bQsRIJoJYK5b8WAxXFeOfv/UI-I---Ex-1?node-id=0%3A1) diff --git a/subjects/ui/ui-1/ui-1-10/audit/README.md b/subjects/ui/ui-1/ui-1-10/audit/README.md index a87493e..99a203f 100644 --- a/subjects/ui/ui-1/ui-1-10/audit/README.md +++ b/subjects/ui/ui-1/ui-1-10/audit/README.md @@ -1,12 +1,14 @@ -[Example here](https://www.figma.com/file/kzc8YNUZsPrcTNrdMt6aLX/UI-Challenge-I---UI-I-Ex-8) +#### Audit instructions -Make sure +##### Make sure -- The screen designed matches the image -- There are 2 pages: one for the screen and one with the symbols +###### The screen designed matches the image +###### There are 2 pages: one for the screen and one with the symbols ![Example](SpotifyCK2.png) -- The background is made with linear color function +###### The background is made with linear color function - ![Example](SpotifyCK1.png) \ No newline at end of file + ![Example](SpotifyCK1.png) + +[Example here](https://www.figma.com/file/kzc8YNUZsPrcTNrdMt6aLX/UI-Challenge-I---UI-I-Ex-8) diff --git a/subjects/ui/ui-1/ui-1-11/audit/README.md b/subjects/ui/ui-1/ui-1-11/audit/README.md index b737c7f..0dd5b23 100644 --- a/subjects/ui/ui-1/ui-1-11/audit/README.md +++ b/subjects/ui/ui-1/ui-1-11/audit/README.md @@ -1,13 +1,16 @@ -[Example here](https://www.figma.com/file/7hv3wv2rUPRY0Sc3Dd7lZh/UI-I-Challenge---UI-Ex-11) +#### Audit instructions -Make sure: +##### Make sure: -- The screen designed matches the image -- All layers have a name and belong to a group of graphic elements +###### The screen designed matches the image +###### All layers have a name and belong to a group of graphic elements ![Example](DashboardCK1.png) -- There are 2 pages: one for the screen and one with the symbol -- The overlay is done with transparency -- The mask was used to change the shape of the image \ No newline at end of file +###### There are 2 pages: one for the screen and one with the symbol +###### The overlay is done with transparency +###### The mask was used to change the shape of the image + + +[Example here](https://www.figma.com/file/7hv3wv2rUPRY0Sc3Dd7lZh/UI-I-Challenge---UI-Ex-11) diff --git a/subjects/ui/ui-1/ui-1-2/audit/README.md b/subjects/ui/ui-1/ui-1-2/audit/README.md index 64ac0d8..9564ab0 100644 --- a/subjects/ui/ui-1/ui-1-2/audit/README.md +++ b/subjects/ui/ui-1/ui-1-2/audit/README.md @@ -1,7 +1,9 @@ -Make sure +#### Audit instructions -- There are screenshots of the 7 pages or screens -- The colors match with the ones from the screens -- There are color codes +##### Make sure -[Exercise completed](https://www.figma.com/file/9YVlgVGYdg4fTyWUsDLi7c/UI-I---Ex-2?node-id=3%3A8) +###### There are screenshots of the 7 pages or screens +###### The colors match with the ones from the screens +###### There are color codes + +##### [Exercise completed](https://www.figma.com/file/9YVlgVGYdg4fTyWUsDLi7c/UI-I---Ex-2?node-id=3%3A8) diff --git a/subjects/ui/ui-1/ui-1-3/audit/README.md b/subjects/ui/ui-1/ui-1-3/audit/README.md index ab7be45..875f3f1 100644 --- a/subjects/ui/ui-1/ui-1-3/audit/README.md +++ b/subjects/ui/ui-1/ui-1-3/audit/README.md @@ -1,19 +1,48 @@ +#### Audit instructions + + [Exercise example](https://www.figma.com/file/IXsXrJz9FPKPp8PKQxNhxT/UI---Ex-3?node-id=0%3A1) -Here are examples of combinations on websites. Please make sure : +Here are examples of combinations on websites. + +##### Make sure : + +###### The websites or apps chosen by the students match with a correct color wheel combinations +###### There are 3 websites or apps per color palette combination +##### Monochromatic examples: + +-[https://www.benefitcosmetics.com/](https://www.benefitcosmetics.com/) +-[http://www.jwilouvres.com.au/](http://www.jwilouvres.com.au/) +-[http://blank.com.pt/](http://blank.com.pt/) + +##### Analogous examples: + +-[https://www.natuurenmilieu.nl/](https://www.natuurenmilieu.nl/) +-[https://campesinorum.com/](https://campesinorum.com/) +-[https://www.lobster.es/](https://www.lobster.es/) + +##### Complementary examples: + +-[https://www.rolandgarros.com/](https://www.rolandgarros.com/fr-fr) +-[https://squilla.io/](https://squilla.io/) +-[https://gomim.com/en/](https://gomim.com/en/) -- The websites or apps chosen by the students match with a correct color wheel combinations -- There are 3 websites or apps per color palette combination -- Monochromatic examples: -[https://www.benefitcosmetics.com/](https://www.benefitcosmetics.com/) -[http://www.jwilouvres.com.au/](http://www.jwilouvres.com.au/) -[http://blank.com.pt/](http://blank.com.pt/) +##### Split complementary examples: -- Analogous examples: -[https://www.natuurenmilieu.nl/](https://www.natuurenmilieu.nl/) -[https://campesinorum.com/](https://campesinorum.com/) -[https://www.lobster.es/](https://www.lobster.es/) +-[https://flythenest.io/en/](https://flythenest.io/en/) +-[https://www.kineuphorics.com/](https://www.kineuphorics.com/) +-[https://www.ma-tea.de/](https://www.ma-tea.de/) -- Complementary examples: -[https://www.rolandgarros.com/](https://www.rolandgarros.com/fr-fr) -[https://squilla.io/](https://squilla.io/) -[https://gomim.com/en/](https://gomim.com/en/) +##### Triadic examples -- Split complementary examples: -[https://flythenest.io/en/](https://flythenest.io/en/) -[https://www.kineuphorics.com/](https://www.kineuphorics.com/) -[https://www.ma-tea.de/](https://www.ma-tea.de/) +-[https://normalnow.com/](https://normalnow.com/) +-[https://brainbakery.com/en/](https://brainbakery.com/en/) +-[https://www.barkbox.com/](https://www.barkbox.com/) -- Triadic -[https://normalnow.com/](https://normalnow.com/) -[https://brainbakery.com/en/](https://brainbakery.com/en/) -[https://www.barkbox.com/](https://www.barkbox.com/) +##### Dual complementary or Tetradic examples -- Dual complementary or Tetradic -[https://www.airtable.com/](https://www.airtable.com/) -[https://calendar.google.com/](https://calendar.google.com/) -[https://www.ebay.com/](https://www.ebay.com/) +-[https://www.airtable.com/](https://www.airtable.com/) +-[https://calendar.google.com/](https://calendar.google.com/) +-[https://www.ebay.com/](https://www.ebay.com/) ![Resource](Resource.png) diff --git a/subjects/ui/ui-1/ui-1-4/audit/README.md b/subjects/ui/ui-1/ui-1-4/audit/README.md index 454361c..2a22462 100644 --- a/subjects/ui/ui-1/ui-1-4/audit/README.md +++ b/subjects/ui/ui-1/ui-1-4/audit/README.md @@ -1,9 +1,14 @@ -To have a good moodboard, you need: +#### Audit instructions -- Several pictures that are graphically consistent -- 2 to 3 main colors that stand out -- The colors must have at least one code (RGB, Hex, or HSB) -- Please check the code to make sure it matches with the designated color [thanks to this tool](http://onlinewebtool.com/colorpicker.php) -- The document should be a PDF +##### To have a good moodboard, make sure there are: -- Examples of moodboards (in addition, the moodboard should include the color codes): -[https://lovestylecomunicacion.com/wp-content/uploads/2017/09/A.png](https://lovestylecomunicacion.com/wp-content/uploads/2017/09/A.png) -[https://caseperlatesta.com/wp-content/uploads/2015/09/Moodboard23_grey_peach-1024x1024.jpg](https://caseperlatesta.com/wp-content/uploads/2015/09/Moodboard23_grey_peach-1024x1024.jpg) -[https://i.pinimg.com/564x/ee/9d/d6/ee9dd6fbb82b0e5b4dd2924580b765dd.jpg](https://i.pinimg.com/564x/ee/9d/d6/ee9dd6fbb82b0e5b4dd2924580b765dd.jpg) +###### Several pictures that are graphically consistent +###### 2 to 3 main colors that stand out +###### The colors must have at least one code (RGB, Hex, or HSB) +###### Please check the code to make sure it matches with the designated color [thanks to this tool](http://onlinewebtool.com/colorpicker.php) +###### The document should be a PDF + +##### Examples of moodboards (in addition, the moodboard should include the color codes): +-[https://lovestylecomunicacion.com/wp-content/uploads/2017/09/A.png](https://lovestylecomunicacion.com/wp-content/uploads/2017/09/A.png) +-[https://caseperlatesta.com/wp-content/uploads/2015/09/Moodboard23_grey_peach-1024x1024.jpg](https://caseperlatesta.com/wp-content/uploads/2015/09/Moodboard23_grey_peach-1024x1024.jpg) +-[https://i.pinimg.com/564x/ee/9d/d6/ee9dd6fbb82b0e5b4dd2924580b765dd.jpg](https://i.pinimg.com/564x/ee/9d/d6/ee9dd6fbb82b0e5b4dd2924580b765dd.jpg) diff --git a/subjects/ui/ui-1/ui-1-5/audit/README.md b/subjects/ui/ui-1/ui-1-5/audit/README.md index 9ffb307..2bca014 100644 --- a/subjects/ui/ui-1/ui-1-5/audit/README.md +++ b/subjects/ui/ui-1/ui-1-5/audit/README.md @@ -1,19 +1,53 @@ --[https://unric.org/no](https://unric.org/no) - Roboto Condensed - Roboto - Verdana - Open Sans - --[https://www.strongbowcider.com/bug-exterminator-brisbane](https://www.strongbowcider.com/bug-exterminator-brisbane) - Helvetica Neue - Helvetica Neue - Condensed Bold - --[http://www.bbqgrillsandfire.com/](http://www.bbqgrillsandfire.com/) - Francois One - Special Elite - Lucida Grande - --[https://pt.wikipedia.org/wiki/Mario_Botta](https://pt.wikipedia.org/wiki/Mario_Botta) - Arial - Georgia - Monospace - --[https://texas-private-investigator.com/](https://texas-private-investigator.com/) - Open Sans - Poppins - Lora - sans-serif - Cinzel - Roboto - Playfair Display - Lucida Grande - --[https://bumble.com/](https://bumble.com/) - Circular 20 - --[https://adopte1poule.fr/](https://adopte1poule.fr/) - Open Sans - Roboto - Font Awesome 5 Free - --[http://slaveryfootprint.org/](http://slaveryfootprint.org/) - Arial - Georgia - Helvetica - --[https://www.tomorrowland.com/fr/festival/bienvenue](https://www.tomorrowland.com/fr/festival/bienvenue) - Europa - --[https://artisanscanada.com/](https://artisanscanada.com/) - Avenir Next +#### Audit instructions + +##### Make sure the following typographies are found: + + +-[https://unric.org/no](https://unric.org/no) +###### Roboto Condensed +###### Roboto +###### Verdana +###### Open Sans + +-[https://www.strongbowcider.com/bug-exterminator-brisbane](https://www.strongbowcider.com/bug-exterminator-brisbane) +###### Helvetica Neue +###### Helvetica Neue +###### Condensed Bold + +-[http://www.bbqgrillsandfire.com/](http://www.bbqgrillsandfire.com/) +###### Francois One +###### Special Elite +###### Lucida Grande + +-[https://pt.wikipedia.org/wiki/Mario_Botta](https://pt.wikipedia.org/wiki/Mario_Botta) +###### Arial +###### Georgia +###### Monospace + +-[https://texas-private-investigator.com/](https://texas-private-investigator.com/) +###### Open Sans +###### Poppins +###### Lora +###### Cinzel +###### Roboto +###### Playfair Display +###### Lucida Grande + +-[https://bumble.com/](https://bumble.com/) +###### Circular 20 + +-[https://adopte1poule.fr/](https://adopte1poule.fr/) +###### Open Sans +###### Roboto +###### Font Awesome 5 Free + +-[http://slaveryfootprint.org/](http://slaveryfootprint.org/) +###### Arial +###### Georgia +###### Helvetica + +-[https://www.tomorrowland.com/fr/festival/bienvenue](https://www.tomorrowland.com/fr/festival/bienvenue) +###### Europa + +-[https://artisanscanada.com/](https://artisanscanada.com/) +###### Avenir Next diff --git a/subjects/ui/ui-1/ui-1-6/audit/README.md b/subjects/ui/ui-1/ui-1-6/audit/README.md index 64a0a8e..44e1e78 100644 --- a/subjects/ui/ui-1/ui-1-6/audit/README.md +++ b/subjects/ui/ui-1/ui-1-6/audit/README.md @@ -1,13 +1,16 @@ -[Example here](https://www.figma.com/file/SbQMPjfLOzg92g8YZFlrRh/UI-I---Ex-5) - -Make sure: - -- There are 4 different fonts -- There is a caption next to the font to describe what is it -- Max 2 different colors have been used -- There are max 2 different typographies (Bold, italic, normal, light, etc. are fonts, not typography) -- Each moodboard should have typography: - - 1 for a title - - 1 for a button - - 1 for a description - - 1 for the text \ No newline at end of file +#### Audit instructions + +##### Make sure: + +###### There are 4 different fonts +###### There is a caption next to the font to describe what is it +###### Max 2 different colors have been used +###### There are max 2 different typographies (Bold, italic, normal, light, etc. are fonts, not typography) +###### Each moodboard should have typography: + ###### 1 for a title + ###### 1 for a button + ###### 1 for a description + ###### 1 for the text + + +[Example here](https://www.figma.com/file/SbQMPjfLOzg92g8YZFlrRh/UI-I---Ex-5) \ No newline at end of file diff --git a/subjects/ui/ui-1/ui-1-7/audit/README.md b/subjects/ui/ui-1/ui-1-7/audit/README.md index 296c741..a38cd6d 100644 --- a/subjects/ui/ui-1/ui-1-7/audit/README.md +++ b/subjects/ui/ui-1/ui-1-7/audit/README.md @@ -1,11 +1,15 @@ -[Example here](https://www.figma.com/file/LRgyZDBVgIq3PzjewTKI2c/UI-Challenge-I---UI-I-Ex-7) +#### Audit instructions -Open the Figma file and inspect it. Make sure: +##### Open the Figma file and inspect it. -- There are two half circles as this one. +##### Make sure: + +###### There are two half circles as this one. ![Example](Timer2.png) -- All the layers are labeled and organized in groups +###### All the layers are labeled and organized in groups - ![Example](Timer1.png) \ No newline at end of file + ![Example](Timer1.png) + +[Example here](https://www.figma.com/file/LRgyZDBVgIq3PzjewTKI2c/UI-Challenge-I---UI-I-Ex-7) \ No newline at end of file diff --git a/subjects/ui/ui-1/ui-1-8/audit/README.md b/subjects/ui/ui-1/ui-1-8/audit/README.md index 037932a..118f1ac 100644 --- a/subjects/ui/ui-1/ui-1-8/audit/README.md +++ b/subjects/ui/ui-1/ui-1-8/audit/README.md @@ -1,13 +1,15 @@ - [Example here](https://www.figma.com/file/qBYmuatLnhRrWMGlf5vMau/UI-I-Challenge---UI-Ex-10) +#### Audit instructions -Make sure: +##### Make sure: -- The screen designed matches the image -- All layers have a name and belong to a group of graphic elements +###### The screen designed matches the image +###### All layers have a name and belong to a group of graphic elements ![Example](WatchCK.png) -- There are 2 pages: one for the screen and one with the symbol -- The overlay is done with transparency -- The mask was used to change the shape of the image \ No newline at end of file +###### There are 2 pages: one for the screen and one with the symbol +###### The overlay is done with transparency +###### The mask was used to change the shape of the image + +[Example here](https://www.figma.com/file/qBYmuatLnhRrWMGlf5vMau/UI-I-Challenge---UI-Ex-10) \ No newline at end of file diff --git a/subjects/ui/ui-1/ui-1-9/audit/README.md b/subjects/ui/ui-1/ui-1-9/audit/README.md index c11f38a..256e7db 100644 --- a/subjects/ui/ui-1/ui-1-9/audit/README.md +++ b/subjects/ui/ui-1/ui-1-9/audit/README.md @@ -1,26 +1,28 @@ -[Example here](https://www.figma.com/file/D6HC3Su97UQPfGIOmG0Yll/UI-Challenge-I---UI-Ex-9) +#### Audit instructions -Make sure: +##### Make sure: -- The screen designed matches the image -- All layers have a name and belong to a group of graphic elements +###### The screen designed matches the image +###### All layers have a name and belong to a group of graphic elements ![Example](FlightCK5.png) -- There are 2 pages: one for the screen and one with the symbols +###### There are 2 pages: one for the screen and one with the symbols ![Example](FlightCK2.png) -- Masks were used to change the shape of the image +###### Masks were used to change the shape of the image ![Example](FlightCK1.png) -- The overlay is done with transparency +###### The overlay is done with transparency ![Example](FlightCK3.png) - ![Example](FlightCK4.png) \ No newline at end of file + ![Example](FlightCK4.png) + +[Example here](https://www.figma.com/file/D6HC3Su97UQPfGIOmG0Yll/UI-Challenge-I---UI-Ex-9) diff --git a/subjects/ui/ui-2/ui-2-1/audit/README.md b/subjects/ui/ui-2/ui-2-1/audit/README.md index ddc2576..62d35a9 100644 --- a/subjects/ui/ui-2/ui-2-1/audit/README.md +++ b/subjects/ui/ui-2/ui-2-1/audit/README.md @@ -1,5 +1,9 @@ -Make sure +#### Audit instructions -- The document is a PDF -- There are 4 pages -- On each page, there is a template, an organism, a molecule and an atom -[Example here](https://www.figma.com/file/fzqDkk8Zc8qJCiSMbKV0Ei/UI-II---Ex-1?node-id=0%3A1) +##### Make sure + +###### The document is a PDF +###### There are 4 pages +###### On each page, there is a template, an organism, a molecule and an atom + +[Example here](https://www.figma.com/file/fzqDkk8Zc8qJCiSMbKV0Ei/UI-II---Ex-1?node-id=0%3A1) diff --git a/subjects/ui/ui-2/ui-2-2/audit/README.md b/subjects/ui/ui-2/ui-2-2/audit/README.md index f702bee..aee876a 100644 --- a/subjects/ui/ui-2/ui-2-2/audit/README.md +++ b/subjects/ui/ui-2/ui-2-2/audit/README.md @@ -1,5 +1,9 @@ -Make sure +#### Audit instructions -- There is a PDF document -- The layers are indicated with numbers -- 2 numbers can be switched as long as the layering of layers is respected -[Example here](https://www.figma.com/file/YnrbPhItwgUy56I6Yne14S/UI-II---Ex-2?node-id=2%3A3) +##### Make sure + +###### There is a PDF document +###### The layers are indicated with numbers +###### 2 numbers can be switched as long as the layering of layers is respected + +[Example here](https://www.figma.com/file/YnrbPhItwgUy56I6Yne14S/UI-II---Ex-2?node-id=2%3A3) diff --git a/subjects/ui/ui-2/ui-2-3/audit/README.md b/subjects/ui/ui-2/ui-2-3/audit/README.md index 1cec4a9..af417cf 100644 --- a/subjects/ui/ui-2/ui-2-3/audit/README.md +++ b/subjects/ui/ui-2/ui-2-3/audit/README.md @@ -1,5 +1,9 @@ -Make sure +#### Audit instructions -- There is a PDF document -- There are at least 10 elements from easyJet -- There is at least one atom, one molecule, one organism : [Atomic Design Methodology](https://atomicdesign.bradfrost.com/chapter-2/) -[Example here](https://www.figma.com/file/37jw27RusbejfJwlhC8OYK/UI-II---Ex-4?node-id=0%3A1) +##### Make sure + +###### There is a PDF document +###### There are at least 10 elements from easyJet +###### There is at least one atom, one molecule, one organism : [Atomic Design Methodology](https://atomicdesign.bradfrost.com/chapter-2/) + +-[Example here](https://www.figma.com/file/37jw27RusbejfJwlhC8OYK/UI-II---Ex-4?node-id=0%3A1) diff --git a/subjects/ui/ui-2/ui-2-4/audit/README.md b/subjects/ui/ui-2/ui-2-4/audit/README.md index 48ee0eb..b5a7a34 100644 --- a/subjects/ui/ui-2/ui-2-4/audit/README.md +++ b/subjects/ui/ui-2/ui-2-4/audit/README.md @@ -1,12 +1,14 @@ -Make sure there is: +#### Audit instructions -- A moodboard for a climbing group with: - - Pictures - - Colors (2 to 3 main colors) - - Typography -- A library including: - - At least graphic design 20 elements - - At least one atom - - At least one molecule - - At least one organism - - At least 5 multistate elements \ No newline at end of file +##### Make sure there is: + +###### A moodboard for a climbing group with: + ###### Pictures + ###### Colors (2 to 3 main colors) + ###### Typography +###### A library including: + ###### At least graphic design 20 elements + ###### At least one atom + ###### At least one molecule + ###### At least one organism + ###### At least 5 multistate elements \ No newline at end of file diff --git a/subjects/ui/ui-2/ui-2-5/audit/README.md b/subjects/ui/ui-2/ui-2-5/audit/README.md index 059b09f..cb5ec8a 100644 --- a/subjects/ui/ui-2/ui-2-5/audit/README.md +++ b/subjects/ui/ui-2/ui-2-5/audit/README.md @@ -1,12 +1,14 @@ -Make sure there is: +#### Audit instructions -- A moodboard for a dating app with: - - Pictures - - Colors (2 to 3 main colors) - - Typography -- A library including: - - At least graphic design 20 elements - - At least one atom - - At least one molecule - - At least one organism - - At least 5 multistate elements \ No newline at end of file +##### Make sure there is: + +###### A moodboard for a dating app with: + ###### Pictures + ###### Colors (2 to 3 main colors) + ###### Typography +###### A library including: + ###### At least graphic design 20 elements + ###### At least one atom + ###### At least one molecule + ###### At least one organism + ###### At least 5 multistate elements \ No newline at end of file diff --git a/subjects/ui/ui-3/ui-3-1/audit/README.md b/subjects/ui/ui-3/ui-3-1/audit/README.md index 037e0ca..2d23681 100644 --- a/subjects/ui/ui-3/ui-3-1/audit/README.md +++ b/subjects/ui/ui-3/ui-3-1/audit/README.md @@ -1,5 +1,13 @@ -Make sure: +#### Audit instructions -- There is one PDF or one page per image -- There are colored lines on top of the images -- The lines highlight aligned elements. -[1st screen example](https://www.figma.com/file/KOzd8yZuJvGLmZLuXjBgDg/UI-III-Ex-1.1) -[2nd screen example](https://www.figma.com/file/QXzdFwwUa8EoQgD3k8CqUC/UI-III-EX-1.2) -[3rd screen example](https://www.figma.com/file/9KNmLun5iZ2lbTOaX91fr2/UI-III-Ex-1.3) -[4th screen example](https://www.figma.com/file/EqGJPRCBtS0yJBUwHJdmwU/UI-III-Ex-1.4) -[5th screen example](https://www.figma.com/file/X5lYr8zLmMAazTHeYtfWMm/UI-III-Ex-1.5) +##### Make sure: + +###### There is one PDF or one page per image +###### There are colored lines on top of the images +###### The lines highlight aligned elements. + +-[1st screen example](https://www.figma.com/file/KOzd8yZuJvGLmZLuXjBgDg/UI-III-Ex-1.1) +-[2nd screen example](https://www.figma.com/file/QXzdFwwUa8EoQgD3k8CqUC/UI-III-EX-1.2) +-[3rd screen example](https://www.figma.com/file/9KNmLun5iZ2lbTOaX91fr2/UI-III-Ex-1.3) +-[4th screen example](https://www.figma.com/file/EqGJPRCBtS0yJBUwHJdmwU/UI-III-Ex-1.4) +-[5th screen example](https://www.figma.com/file/X5lYr8zLmMAazTHeYtfWMm/UI-III-Ex-1.5) diff --git a/subjects/ui/ui-3/ui-3-10/audit/README.md b/subjects/ui/ui-3/ui-3-10/audit/README.md index 8ddd816..b8a0f01 100644 --- a/subjects/ui/ui-3/ui-3-10/audit/README.md +++ b/subjects/ui/ui-3/ui-3-10/audit/README.md @@ -1,8 +1,10 @@ -Make sure: +#### Audit instructions -- There is a PDF document with a proper title -- There are at least 5 examples of micro-interactions or animations -- The name of each app or website is written +##### Make sure: + +###### There is a PDF document with a proper title +###### There are at least 5 examples of micro-interactions or animations +###### The name of each app or website is written Micro-interactions/micro-animations examples: [https://blog.geekyants.com/micro-interactions-and-micro-animations-4eb2ed5cc7f3](https://blog.geekyants.com/micro-interactions-and-micro-animations-4eb2ed5cc7f3) diff --git a/subjects/ui/ui-3/ui-3-11/audit/README.md b/subjects/ui/ui-3/ui-3-11/audit/README.md index 6f89af4..fe27bc8 100644 --- a/subjects/ui/ui-3/ui-3-11/audit/README.md +++ b/subjects/ui/ui-3/ui-3-11/audit/README.md @@ -1,8 +1,10 @@ -Make sure: +#### Audit instructions -- There is a PDF document with a proper title -- There are at least 5 signs of consistency -- The name of each app or website is written +##### Make sure: + +###### There is a PDF document with a proper title +###### There are at least 5 signs of consistency +###### The name of each app or website is written Examples of signs of consistency: diff --git a/subjects/ui/ui-3/ui-3-2/audit/README.md b/subjects/ui/ui-3/ui-3-2/audit/README.md index fe8ba3d..45e76b2 100644 --- a/subjects/ui/ui-3/ui-3-2/audit/README.md +++ b/subjects/ui/ui-3/ui-3-2/audit/README.md @@ -1,7 +1,7 @@ -Make sure: +##### Make sure: -- There are at least five combinations of buttons, menus or call to actions. -- The multi state buttons are gathered in groups -- The document is clean and the elements are aligned -[Example here](https://www.figma.com/file/ahSnWRZeKBO62oJDiXltxY/UI-III---Ex-2) +###### There are at least five combinations of buttons, menus or call to actions. +###### The multi state buttons are gathered in groups +###### The document is clean and the elements are aligned -[Example here](https://www.figma.com/file/ahSnWRZeKBO62oJDiXltxY/UI-III---Ex-2) /!\ The screenshots date back to nov 2021. They may differ from the current version of [Nintendo.com](http://Nintendo.com) but the rules are the same diff --git a/subjects/ui/ui-3/ui-3-3/audit/README.md b/subjects/ui/ui-3/ui-3-3/audit/README.md index 5ca9bf1..159a3b0 100644 --- a/subjects/ui/ui-3/ui-3-3/audit/README.md +++ b/subjects/ui/ui-3/ui-3-3/audit/README.md @@ -1,7 +1,9 @@ -Please make sure +#### Audit instructions -- There is a PDF document -- At least 3 different measures have been shown, like : +##### Make sure + +###### There is a PDF document +###### At least 3 different measures have been shown, like : - Color contrast - Highlighted or enlarged text when hovering - Links color that is different from the body text's diff --git a/subjects/ui/ui-3/ui-3-4/audit/README.md b/subjects/ui/ui-3/ui-3-4/audit/README.md index 5ca9bf1..3598f94 100644 --- a/subjects/ui/ui-3/ui-3-4/audit/README.md +++ b/subjects/ui/ui-3/ui-3-4/audit/README.md @@ -1,7 +1,9 @@ -Please make sure +#### Audit instructions -- There is a PDF document -- At least 3 different measures have been shown, like : +##### Make sure + +###### There is a PDF document +###### At least 3 different measures have been shown, like : - Color contrast - Highlighted or enlarged text when hovering - Links color that is different from the body text's @@ -10,6 +12,6 @@ Please make sure - Error states - etc. -Example of presentation and explanation: +##### Example of presentation and explanation: -[https://www.convinceandconvert.com/digital-marketing/accessible-website-examples/](https://www.convinceandconvert.com/digital-marketing/accessible-website-examples/) diff --git a/subjects/ui/ui-3/ui-3-5/audit/README.md b/subjects/ui/ui-3/ui-3-5/audit/README.md index 7e3eef0..3864508 100644 --- a/subjects/ui/ui-3/ui-3-5/audit/README.md +++ b/subjects/ui/ui-3/ui-3-5/audit/README.md @@ -1,7 +1,9 @@ -Make sure: +#### Audit instructions -- There is a PDF document with a proper title -- There are at least 5 different examples of breadcrumbs -- The name of each app or website is written +##### Make sure: + +###### There is a PDF document with a proper title +###### There are at least 5 different examples of breadcrumbs +###### The name of each app or website is written Breadcrumb examples: [https://www.justinmind.com/blog/breadcrumb-examples/](https://www.justinmind.com/blog/breadcrumb-examples/) \ No newline at end of file diff --git a/subjects/ui/ui-3/ui-3-6/audit/README.md b/subjects/ui/ui-3/ui-3-6/audit/README.md index 9a5bcc2..90b9f66 100644 --- a/subjects/ui/ui-3/ui-3-6/audit/README.md +++ b/subjects/ui/ui-3/ui-3-6/audit/README.md @@ -1,7 +1,9 @@ -Make sure: +#### Audit instructions -- There is a PDF document with a proper title -- There are at least 5 examples of toggle buttons -- The name of each app or website is written +##### Make sure: + +###### There is a PDF document with a proper title +###### There are at least 5 examples of toggle buttons +###### The name of each app or website is written Toggle switch buttons examples: [https://bashooka.com/coding/creative-fun-toggle-switch-button-examples/](https://bashooka.com/coding/creative-fun-toggle-switch-button-examples/) \ No newline at end of file diff --git a/subjects/ui/ui-3/ui-3-7/audit/README.md b/subjects/ui/ui-3/ui-3-7/audit/README.md index d262ea5..daf2231 100644 --- a/subjects/ui/ui-3/ui-3-7/audit/README.md +++ b/subjects/ui/ui-3/ui-3-7/audit/README.md @@ -1,7 +1,9 @@ -Make sure: +#### Audit instructions -- There is a PDF document with a proper title -- There are at least 5 examples of radio buttons -- The name of each app or website is written +##### Make sure: + +###### There is a PDF document with a proper title +###### There are at least 5 examples of radio buttons +###### The name of each app or website is written Radio buttons examples: [https://gscode.in/radio-button-css/](https://gscode.in/radio-button-css/) \ No newline at end of file diff --git a/subjects/ui/ui-3/ui-3-8/audit/README.md b/subjects/ui/ui-3/ui-3-8/audit/README.md index 649cabf..d80be0b 100644 --- a/subjects/ui/ui-3/ui-3-8/audit/README.md +++ b/subjects/ui/ui-3/ui-3-8/audit/README.md @@ -1,7 +1,9 @@ -Make sure: +#### Audit instructions -- There is a PDF document with a proper title -- There are at least 5 examples of calendars -- The name of each app or website is written +##### Make sure: + +###### There is a PDF document with a proper title +###### There are at least 5 examples of calendars +###### The name of each app or website is written Calendar examples: [https://uicookies.com/html-calendar/](https://uicookies.com/html-calendar/) \ No newline at end of file diff --git a/subjects/ui/ui-3/ui-3-9/audit/README.md b/subjects/ui/ui-3/ui-3-9/audit/README.md index e1d3abe..40f89a4 100644 --- a/subjects/ui/ui-3/ui-3-9/audit/README.md +++ b/subjects/ui/ui-3/ui-3-9/audit/README.md @@ -1,7 +1,9 @@ -Make sure: +#### Audit instructions -- There is a PDF document with a proper title -- There are at least 5 examples of time pickers -- The name of each app or website is written +##### Make sure: + +###### There is a PDF document with a proper title +###### There are at least 5 examples of time pickers +###### The name of each app or website is written Time picker examples: [https://uigarage.net/category/time-picker/](https://uigarage.net/category/time-picker/) \ No newline at end of file diff --git a/subjects/ui/ui-4/ui-4-1/audit/README.md b/subjects/ui/ui-4/ui-4-1/audit/README.md index d5a3a52..7fe108e 100644 --- a/subjects/ui/ui-4/ui-4-1/audit/README.md +++ b/subjects/ui/ui-4/ui-4-1/audit/README.md @@ -1,9 +1,11 @@ -Make sure there is: +#### Audit instructions -- A PDF document -- Inside it, a moodboard that includes - - Pictures - - 2 to 3 main colors +##### Make sure there is: + +###### A PDF document +###### Inside it, a moodboard that includes + ###### Pictures + ###### 2 to 3 main colors - Examples of typography applied to graphic elements - Title - Description or subtitle diff --git a/subjects/ui/ui-4/ui-4-2/audit/README.md b/subjects/ui/ui-4/ui-4-2/audit/README.md index 70e5cb7..e562f0e 100644 --- a/subjects/ui/ui-4/ui-4-2/audit/README.md +++ b/subjects/ui/ui-4/ui-4-2/audit/README.md @@ -1,8 +1,10 @@ -Make sure there is: +#### Audit instructions -- A library including: - - At least graphic design 30 elements - - At least 5 atoms - - At least 5 molecules - - At least 5 organisms - - At least 10 multistate elements \ No newline at end of file +##### Make sure there is: + +###### A library including: + ###### At least graphic design 30 elements + ###### At least 5 atoms + ###### At least 5 molecules + ###### At least 5 organisms + ###### At least 10 multistate elements \ No newline at end of file diff --git a/subjects/ui/ui-4/ui-4-3/audit/README.md b/subjects/ui/ui-4/ui-4-3/audit/README.md index b20050f..bdd09bc 100644 --- a/subjects/ui/ui-4/ui-4-3/audit/README.md +++ b/subjects/ui/ui-4/ui-4-3/audit/README.md @@ -1 +1,3 @@ -Make sure there are 5 screens with style, colors, buttons, text that match with the initial wireframes. \ No newline at end of file +#### Audit instructions + +##### Make sure there are 5 screens with style, colors, buttons, text that match with the initial wireframes. \ No newline at end of file diff --git a/subjects/ui/ui-4/ui-4-4/audit/README.md b/subjects/ui/ui-4/ui-4-4/audit/README.md index bd86d4b..3863ddb 100644 --- a/subjects/ui/ui-4/ui-4-4/audit/README.md +++ b/subjects/ui/ui-4/ui-4-4/audit/README.md @@ -1,6 +1,8 @@ -Make sure: +#### Audit instructions -- There is a starting screen -- There is an ending screen -- All the connections between screens work -- There are multistate buttons which change every time you click somewhere \ No newline at end of file +##### Make sure: + +###### There is a starting screen +###### There is an ending screen +###### All the connections between screens work +###### There are multistate buttons which change every time you click somewhere \ No newline at end of file diff --git a/subjects/ui/ui-4/ui-4-5/audit/README.md b/subjects/ui/ui-4/ui-4-5/audit/README.md index bda9bea..0cee93e 100644 --- a/subjects/ui/ui-4/ui-4-5/audit/README.md +++ b/subjects/ui/ui-4/ui-4-5/audit/README.md @@ -1,6 +1,8 @@ -Make sure there are: +#### Audit instructions -- A desirability testing board with 25+ different adjectives -- Pictures from the desirability test -- A PDF document with the outcomes of the desirability test -- If the outcomes are not consistent with the values, 3 suggestions on how to make the moodboard and design library evolve. \ No newline at end of file +##### Make sure there are: + +###### A desirability testing board with 25+ different adjectives +###### Pictures from the desirability test +###### A PDF document with the outcomes of the desirability test +###### If the outcomes are not consistent with the values, 3 suggestions on how to make the moodboard and design library evolve. \ No newline at end of file diff --git a/subjects/ui/ui-5/ui-5-1/audit/README.md b/subjects/ui/ui-5/ui-5-1/audit/README.md index 079f5f7..38cb62d 100644 --- a/subjects/ui/ui-5/ui-5-1/audit/README.md +++ b/subjects/ui/ui-5/ui-5-1/audit/README.md @@ -1,4 +1,6 @@ -Make sure: +#### Audit instructions -- The chart is complete -- The 5 steps are included in the report \ No newline at end of file +##### Make sure: + +###### The chart is complete +###### The 5 steps are included in the report \ No newline at end of file diff --git a/subjects/ui/ui-5/ui-5-2/audit/README.md b/subjects/ui/ui-5/ui-5-2/audit/README.md index c2a29aa..1b2ced4 100644 --- a/subjects/ui/ui-5/ui-5-2/audit/README.md +++ b/subjects/ui/ui-5/ui-5-2/audit/README.md @@ -1,7 +1,9 @@ -Make sure +#### Audit instructions -- The recommendations are consistent with the report's conclusions -- The recommendations fit in some of these criteria: +##### Make sure + +###### The recommendations are consistent with the report's conclusions +###### The recommendations fit in some of these criteria: - Visibility of system status - Matching between the system and the real world - User Control and Freedom