International Engagement Portal

Interface

Department of Defence / International Policy Division

Organising international engagement information through a world-to-region-to-country navigation journey.

Illustrated desktop scene promoting the International Engagement Portal, with a monitor, keyboard and stationery. — Launch poster introducing the International Engagement Portal.View full image

A collection of globe, map, attaché, passport and aircraft illustrations for the International Engagement Portal. — Standalone illustrations developed for the portal.View full image

Primary and alternative button states above an orange, grey, blue and black interface palette. — Button states and interface colour palette.View full image

A colour-coded world map connects to regional options and progressively more detailed maps. — Navigation concept connecting the world view with regions and countries.View full image

Three globe illustrations compare flight-path clarity, Australia as a hub and a simplified design. — Attaché Management icon development: comparing clarity, emphasis and simplification.View full image

Jared’s contribution

Information architecture, interface design, custom SVG/HTML/CSS navigation and supporting visual communication.

Finding a way through the information

The International Engagement Portal brought together policy guidance, products and resources in a SharePoint environment. The design challenge was to give people a clear way into geographically organised information.

The navigation followed a world-to-region-to-country structure. This gave the interface a consistent organising principle, connecting the overall view with more specific information.

Connecting structure and interface

The work connected information architecture with interface design and implementation. Custom SVG, HTML and CSS navigation translated the geographic structure into an interface people could explore.

Design decisions also had to account for the platform and the team maintaining it. Following Defence ICT feedback, an interaction approach was adapted from JavaScript to CSS to accommodate maintenance requirements.

Supporting the launch

Supporting promotional artwork gave the portal a recognisable visual presence and introduced the resource alongside the digital experience.

Together, the information structure, navigation and communication materials show how design and implementation can work towards the same purpose: helping people understand what a resource contains and where to begin.