Merge pull request #946 from WestpacGEL/content-adobedam-images-articles

Content adobedam images articles
WestpacGEL · Dec 8, 2024 · 0d64d5f · 0d64d5f
2 parents e2e6e71 + a2b1dc2
commit 0d64d5f
Show file tree

Hide file tree

Showing 80 changed files with 398 additions and 443 deletions.
diff --git a/apps/site/src/content/articles/accessible-by-design.yaml b/apps/site/src/content/articles/accessible-by-design.yaml
@@ -10,7 +10,10 @@ description: >-
   lifetime.”
 thumbnail:
   src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1666333819/cl9i44qb7000wtc8ihnxv08ex.png
+    https://www.westpac.com.au/content/dam/public/gel/images/accessible-by-design-hero.png
+  alt: >-
+    Hero image depicting icons usually associate with accessibility, Eye, Ear
+    and Person on a wheelchair.
   height: 1212
   width: 3168
 smallDescription: >-
@@ -19,7 +22,10 @@ smallDescription: >-
   of our dna.
 image:
   src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1666333853/cl9i45goa000xtc8i8wgx5cu2.png
-  height: 1080
-  width: 1920
+    https://www.westpac.com.au/content/dam/public/gel/images/accessible-by-design-hero.png
+  alt: >-
+    Hero image depicting icons usually associate with accessibility, Eye, Ear
+    and Person on a wheelchair.
+  height: 1212
+  width: 3168
 author: Michael Colibraro
diff --git a/apps/site/src/content/articles/banking-display-accounts.yaml b/apps/site/src/content/articles/banking-display-accounts.yaml
@@ -2,7 +2,10 @@ name: Banking display of accounts
 thumbnail: {}
 image:
   src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1695774586/cln10ek1v001qvd8idm00epsy.png
-  height: 1080
-  width: 1920
+    https://www.westpac.com.au/content/dam/public/gel/images/banking-display-accounts-hero.png
+  alt: >-
+    Stylised example image of a list of banking accounts as they would appear on
+    a mobile phone.
+  height: 1466
+  width: 2400
 author: Digital Experience
diff --git a/apps/site/src/content/articles/banking-display-transactions.yaml b/apps/site/src/content/articles/banking-display-transactions.yaml
@@ -2,7 +2,10 @@ name: Display of transactions
 thumbnail: {}
 image:
   src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1695782572/cln155psl001uvd8i0fuq9dfs.png
-  height: 1080
-  width: 1920
+    https://www.westpac.com.au/content/dam/public/gel/images/banking-display-transactions-hero.png
+  alt: >-
+    Stylised example image of a list of banking transactions as they would
+    appear on a mobile phone.
+  height: 1466
+  width: 2400
 author: Digital Experience
diff --git a/apps/site/src/content/articles/banking-hand-offs.yaml b/apps/site/src/content/articles/banking-hand-offs.yaml
@@ -2,7 +2,8 @@ name: Hand-offs
 thumbnail: {}
 image:
   src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1695783266/cln15klrw001xvd8igne64soh.png
-  height: 1080
-  width: 1920
+    https://www.westpac.com.au/content/dam/public/gel/images/banking-hand-offs-hero.png
+  alt: Stylised example image of a page loading animation.
+  height: 1468
+  width: 2400
 author: Digital Experience
diff --git a/apps/site/src/content/articles/banking-onboarding.yaml b/apps/site/src/content/articles/banking-onboarding.yaml
@@ -1,8 +1,8 @@
 name: Onboarding
 thumbnail: {}
 image:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1695783106/cln15h6a4001wvd8i9rs50m3t.png
-  height: 1080
-  width: 1920
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/banking-onboarding-hero.png\r"
+  alt: >-
+    Stylised example image of a banking onboarding screen as it would appear on
+    a mobile phone.
 author: Digital Experience
diff --git a/apps/site/src/content/articles/banking-tysk.yaml b/apps/site/src/content/articles/banking-tysk.yaml
@@ -1,8 +1,8 @@
-name: Things you should kn -
+name: Things you should know
 thumbnail: {}
 image:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1695782900/cln15crdr001vvd8igdiy7fcz.png
-  height: 1080
-  width: 1920
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/banking-tysk-hero.png\r"
+  alt: >-
+    Stylised example image of form fields and Things you should know text as
+    they would appear on a mobile phone.
 author: Digital Experience
diff --git a/apps/site/src/content/articles/banking.yaml b/apps/site/src/content/articles/banking.yaml
@@ -11,7 +11,10 @@ description: >-
 thumbnail: {}
 image:
   src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1695868279/cln2k6p0p0025vd8iauie3l0o.png
-  height: 1080
-  width: 1920
+    https://www.westpac.com.au/content/dam/public/gel/images/patterns-banking-hero.png
+  alt: >-
+    Hero image depicting the word Patterns and a mans face with a quote "I just
+    want to get it done so I can get on with my day."
+  height: 1028
+  width: 2400
 author: Digital Experience
diff --git a/apps/site/src/content/articles/banking/content.mdoc b/apps/site/src/content/articles/banking/content.mdoc
@@ -1,5 +1,5 @@
 {% articleBodyImage
-   image={src: "https://res.cloudinary.com/westpac-gel/image/upload/v1695871389/cln2m1do10026vd8i9uf66u3a.png", alt: "orginations", height: 1800, width: 1852}
+   image={src: "https://www.westpac.com.au/content/dam/public/gel/images/banking-quote.png", alt: "We're putting customers at the heart of our solutions, reducing rework and supporting teams to deliver consistent customer journeys more effectively.", height: 249, width: 1093}
    type="body" /%}
 
 By reducing re-work we can achieve increased speed to market and more consistent, simple experiences for our customers, leading to greater satisfaction with the Bank. We support our customers to get what they need done when they need to do it, simply and efficiently.&nbsp;

diff --git a/apps/site/src/content/articles/build-strong-brands.yaml b/apps/site/src/content/articles/build-strong-brands.yaml
@@ -6,16 +6,13 @@ description: >-
   customers. This approach helps us to deliver consistent brand experiences
   across all channels.
 thumbnail:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1667097999/cl9ur3rp6000tf58i5s7y3ote.png
-  height: 1212
-  width: 3168
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/build-strong-brands-card.png\r"
 smallDescription: >-
   Create consistent, on brand journeys to strengthen brand recognition and
   trust.
 image:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1665993797/cl9chovs7000htc8igwry11s4.jpg
-  height: 1080
-  width: 1920
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/build-strong-brands-hero.png\r"
+  alt: >-
+    Image of two signs on a wall with blurred people walking past. One sign says
+    'a customer's perception of your brand' the second sign says 'is your brand'
 author: Marita Purins
diff --git a/apps/site/src/content/articles/code-with-gel.yaml b/apps/site/src/content/articles/code-with-gel.yaml
@@ -1,16 +1,18 @@
 name: Code with GEL
 cardTitle: Code with GEL
+description: >-
+  The GEL coding framework has been built with serviceability in mind,
+  supporting multiple platforms across the Bank that may use different
+  libraries, languages and coding technologies.
 thumbnail:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1663140016/cl81amh5c000mam8i3iuq5qt9.png
-  height: 1212
-  width: 3168
-smallDescription: Automate your environment, scale your projects and speed up your work flow with our cutting edge code library.
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/code-with-gel-card.png\r"
+  alt: Stylist illustration coding terminal screen
+smallDescription: >-
+  Automate your environment, scale your projects and speed up your work flow
+  with our cutting edge code library.
 image:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1663300551/cl83y79gg0013am8iddv886ry.jpg
-  height: 1080
-  width: 1920
-description: >-
-  The GEL coding framework has been built with serviceability in mind, supporting multiple platforms across the Bank that may use different libraries, languages and coding technologies.
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/code-with-gel-hero.jpg\r"
+  alt: >-
+    Image of a piece of cardboard with a shape cut out and printed code showing
+    through from behind. The cardboard has the words GEL code printed on it.
 author: Marita Purins
diff --git a/apps/site/src/content/articles/collaborate-for-change.yaml b/apps/site/src/content/articles/collaborate-for-change.yaml
@@ -4,14 +4,10 @@ description: >-
   Design system change has wide impact, whether it’s a brand change, a component
   or a pattern change so collaboration & early engagement are key.
 thumbnail:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1666855413/cl9qqobm6000cf58idusod3xr.png
-  height: 1212
-  width: 3168
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/collaborate-for-change-card.png\r"
+  alt: Stylised illustration of a bike chain.
 smallDescription: Considered change made collaboratively achieves the best results.
 image:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1663227077/cl82qghhn000tam8ia8c6gxjs.jpg
-  height: 1080
-  width: 1920
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/collaborate-for-change-hero.jpg\r"
+  alt: Image of a child pushing another child down the road on a billycart.
 author: Marita Purins
diff --git a/apps/site/src/content/articles/collaborate-for-change/content.mdoc b/apps/site/src/content/articles/collaborate-for-change/content.mdoc
@@ -28,7 +28,7 @@ When proposing a component change a strong business case is required as change m
 - Adoption across projects, touch-points and platforms
 
 {% articleBodyImage
-   image={src: "https://res.cloudinary.com/westpac-gel/image/upload/v1667029580/cl9tmdbnu000gf58idsyzgaiq.png", alt: "The 5 stages of the process; request, review, feedback, approval and build.", height: 1064, width: 2376}
+   image={src: "https://www.westpac.com.au/content/dam/public/gel/images/collaborate-for-change-process.png", alt: "The 5 stages of the process; request, review, feedback, approval and build.", height: 1064, width: 2376}
    type="bodyWide" /%}
 
 ## Requesting component and pattern change

diff --git a/apps/site/src/content/articles/colour.yaml b/apps/site/src/content/articles/colour.yaml
@@ -6,16 +6,12 @@ description: >-
   colour before we see form. This article explains why we have a colour system
   and how to apply it to your designs.
 thumbnail:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1666755294/cl9p32exi0004u48idenu5zh8.png
-  height: 1212
-  width: 3168
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/colour-card.png\r"
+  alt: Illustration of a rainbow
 smallDescription: >-
   Speed up your workflow, ensure you're on brand and stay accessible with our
   multi-brand colour system.
 image:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1666069890/cl9dqztwo000jtc8iarv46fe1.png
-  height: 1080
-  width: 1920
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/colour-hero.png\r"
+  alt: Image of decorative illustration of coloured scales.
 author: Justin Spencer
diff --git a/apps/site/src/content/articles/colour/content.mdoc b/apps/site/src/content/articles/colour/content.mdoc
@@ -1,6 +1,6 @@
 ## **Colour in brand**
 
-There’s no disputing the significance of colour in branding. Many of the world’s most recognisable brands rely on colour for instant recognition. Colour increases brand recognition by up to 80% _(Source: University of Loyola, Maryland study)_
+There’s no disputing the significance of colour in branding. Many of the world’s most recognisable brands rely on colour for instant recognition. Colour increases brand recognition by up to 80% *(Source: University of Loyola, Maryland study)*
 
 Each brand in the Westpac Group uses a unique colour palette as part of its identity. These colours permeate across every touchpoint in the customer journey. The correct use of these colours plays a crucial role in brand recognition and customer experience. When the colour palette is not applied correctly the integrity of the brand is diluted and the customer journey fragmented.
 
@@ -10,13 +10,13 @@ Applying each of the brand colour palettes in the the digital space comes with i
 
 ### **Challenges include:**
 
-1.  Accessibility requirements.
-2.  Multi-brand - shared code base requirements.
+1. Accessibility requirements.
+1. Multi-brand - shared code base requirements.
 
 ### **Opportunities include:**
 
-1.  Contextualising colour, giving it meaning, purpose and function.
-2.  Applying colour dynamically using code and automated tasks.
+1. Contextualising colour, giving it meaning, purpose and function.
+1. Applying colour dynamically using code and automated tasks.
 
 The Design System provides a flexible, multi-brand colour system which enables us to map each brand palette to a set of core contextual colours. Each of the core colours has a defined purpose and function.
 
@@ -30,7 +30,7 @@ The practical application of the colour system encourages consistency across all
 
 The Colour system is a collection of carefully considered variables (or tokens) designed to work in unison. In consultation with each brand we developed a unique set of corresponding colour values all rigorously tested to ensure brand alignment and guarantee the user interface remained accessible in every possible scenario.
 
-When we reference these colours in our applications we don’t specify the explicit colour value, instead we reference the colours variable (or token). For example the _Primary colour_ in Westpac is #DA1710 (fig 1) however in Rams it’s #047DBC. Our application only needs to know that the _Primary colour_ is being used, the value of that colour is irrelevant.
+When we reference these colours in our applications we don’t specify the explicit colour value, instead we reference the colours variable (or token). For example the *Primary colour* in Westpac is #DA1710 (fig 1) however in Rams it’s #047DBC. Our application only needs to know that the *Primary colour* is being used, the value of that colour is irrelevant.
 
 ### **Secondary palette**
 

diff --git a/apps/site/src/content/articles/data-visualisation.yaml b/apps/site/src/content/articles/data-visualisation.yaml
@@ -7,15 +7,14 @@ description: >-
   use it to create accessible, multi-brand graphs and charts.
 thumbnail:
   src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1687413424/clj6qdu4q0027bn8i5zr512pk.png
+    https://www.westpac.com.au/content/dam/public/gel/images/data-visualisation-card.png
+  alt: Illustration of a pie chart
   height: 1212
   width: 3168
 smallDescription: >-
   The data visualisation system, how it works and how you can use it to create
   accessible, multi-brand charts.
 image:
-  src: >-
-    https://res.cloudinary.com/westpac-gel/image/upload/v1687499154/clj85faof003ibn8i8ib98gpx.png
-  height: 1080
-  width: 1920
+  src: "https://www.westpac.com.au/content/dam/public/gel/images/data-visualisation-hero.png\r"
+  alt: Various graph styles and ways to visualise data.
 author: Justin Spencer