Instructions on how to add an infographic, graph, flowchart or map to a page using the complex image component.
Images added to web pages must have a text alternative that describes the information of that image, except for sensory and decorative images.
What are complex images?
Complex images contain a lot of detail. They include:
infographics: e.g. images that include text descriptions
graphs: e.g. bar or pie graphs
flowcharts: e.g. a step-by-step process that uses images and text
maps: a boundary map of a Victorian local government area.
On this page:
About the complex image component
This component was built to provide information from complex images in an accessible way.
Use the complex image component when you need to provide a longer description for an image or you have data that can be provided in a table. .
How to add a complex image
Scroll down to Page content
Click on Add component and select Complex image.
Complete the following fields:
Title: (this will display as a Heading 3) e.g. Figure 4.2: Excerpt from The Orange Door’s Client Experience Toolkit for staff
Image: no larger than 800px wide, however the ideal size for a complex image is 800px wide x 400px high
Source: (not mandatory) e.g. The Orange Door 2018 evaluation
Corresponding data: Include a detailed description of the content included in the infographic, table, chart or image. For graphs you should include a table with the data from the graph.
You can edit the title fields which display the following options for an image:
View figure {custom title} in full screen
View figure {custom title} in table format
Download {custom title}
If left unchanged, the descriptions will pull in the default complex image title, for example:
View Figure 4.2: Excerpt from The Orange Door’s Client Experience Toolkit for staff in full screen
View Figure 4.2: Excerpt from The Orange Door’s Client Experience Toolkit for staff in table format
Download Figure 4.2: Excerpt from The Orange Door’s Client Experience Toolkit for staff
Complex image examples
Title
Victorian Government advertising expenditure by category 2019−20
Image
Sample complex image - pie chart
Image
Restricted
On
License Type
Creative Commons Attribution 4.0
Source
This the source line.
Corresponding data
CATEGORY | EXPENDITURE $ | EXPENDITURE % |
|---|---|---|
Campaign | $73 million | 86% |
Functional | $7 million | 8% |
Recruitment | $4.6 million | 6% |
Title
Victorian Government advertising expenditure by year
Image
Sample complex image - bar chart
Image
Restricted
On
License Type
Copyrigh=t
Corresponding data
YEAR | EXPENDITURE ($ MILLION) |
|---|---|
2009-10 | $130.3 |
2010-11 | $112.8 |
2011-12 | $103.1 |
2012-13 | $98.4 |
2013-14 | $96.1 |
2014-15 | $94.9 |
2015-16 | $74.6 |
2016-17 | $82.4 |
2017-18 | $105.7 |
2018-19 | $102.8 |
2019-20 | $84.6 |
Title
Figure 4.2: Excerpt from The Orange Door’s Client Experience Toolkit for staff
Image
Figure 4.2: Excerpt from The Orange Door’s Client Experience Toolkit for staff
Image
Restricted
On
License Type
Copyright
Corresponding data
Client journey and practise tips for children and young people
Access: Before, referral, call up, walk in
Screening, ID & Triage: First connection, screening
Assessment & Planning: Exploring issues & context, in between (this could be true for a transition between any stages in the service experience)
Connecting to Services: Transition, leaving
After: Follow-up
Emotional journey
How the client might be feeling and what might be going through their mind
Thoughts and questions; who are these people? Can they help me? Curiosity. Emotions.
What's the point of this? Will there be a place to sit or play that feels comfortable? Anxious. Nervous.
Is this just going to be like all the other services? They seem friendly, not too bubbly. What should I say? Heard. Understood. Respected.
Will my parents get in trouble? Will I be separated from my siblings? Anxious. Worried.
Have I shared too much? How are they using this information? Nervous.
Have I done something wrong? Should I leave? Uncertain.
These people seem nice and helpful. Maybe everything is going to be alright. Supported.
Who's going to take care of me? What will happen to my family after? Worry. Fear.
Wow. Someone cares. Maybe it will be alright. Hopeful.
What staff can do
Making the experience safe and comfortable
Have a calm tone and attitude, but not too cheerful or bubbly. Smile and appear approachable. This helps young people feel safe to share and sets you apart from their past experience of workers.
Explain the system and possible outcomes in plain English as early as possible. This reduces uncertainty and stress, reducing the fear to not speak up.
Explain how information will be used and how you're here to help. This helps them feel supported and safe to share.
Be light-hearted and reciprocal in conversation. This helps them see you as a friendly professional that they can trust; they will be more willing to continue engaging when working with someone they respect and feel respected by.
Check in to see how the service is working for people. This helps people know someone is looking out for them and gives them confidence to continue. It helps you ensure the service is a good fit or it is switched if not.
Qualities and behaviours
Essential considerations for creating a positive and safe client experience
building trust through authenticity
reducing uncertainty and cognitive fatigue
listening, understanding and taking action
modelling positive relationships
instilling hope and possibility
validating initiative and commending progress
respectful and non-judgemental attitudes
welcoming