Search
Close this search box.

Cymru Can: Lorem Ipsum Dolor Sit Amet

See our 7-year plan promoting growth and development for future generations

Well-being of Future Generations Act
fg-hero-03
Future Generations Commissioner for Wales
2023
Cymru Can: our Vision and Purpose
fg-hero-04
Our work
fg-hero-15

See Our Recent Work

Lorem Ipsum

Ut eget lorem in arcu mollis placerat. Aenean finibus massa a lacus ullamcorper lobortis. Etiam dolor orci, ultrices et iaculis vel, volutpat ut nunc.

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Dolor Sit Amet

Consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.

Tempor incididunt

Ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Dolore magna aliqua

Sit amet, consectetur adipiscing elit, sed do eiusmod tempor lorem ipsum.

Well-being of Future Generations Act
fg-hero-03
Well-being of Future Generations Act

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pharetra varius varius. Vivamus eros nisl, mollis vitae elit sit amet, malesuada aliquet est.

Learn More
Future Generations Commissioner for Wales
2023
Future Generations Commissioner for Wales

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pharetra varius varius. Vivamus eros nisl, mollis vitae elit sit amet, malesuada aliquet est.

Learn More
Cymru Can: our Vision and Purpose
fg-hero-04
Cymru Can: our Vision and Purpose

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pharetra varius varius. Vivamus eros nisl, mollis vitae elit sit amet, malesuada aliquet est.

Learn More

Cymru Can

Find out more about the Cymru Can roadmap.

Subscribe to Our Newsletter

Ut eget lorem in arcu mollis placerat. Aenean finibus massa a lacus ullamcorper lobortis. Etiam dolor orci, ultrices et iaculis vel, volutpat ut nunc.

Synesis: Future Generations Mock-up

Introduction

This mock-up is intended to demonstrate basic design and information architecture changes, reorganising the existing content and adding UX elements to enhance the on-page experience.

We assume the content will change as a part of the redevelopment, so it is not meant necessarily as a suggested layout or structure – rather it shows our ability to rapidly prototype new layouts and site elements.

CMS

The entire site is made using Wordpress with Elementor, with no custom coding and very little custom styling. We took this approach to create a site that could be entirely managed by an in-house team without needing to engage an external agency, hence keeping ongoing maintenance costs to a minimum.

A full rebuild would likely involve developing custom elements/widgets for Elementor to exactly respond to aspects of the brief (for example point 3.8 in the brief, the interactive monitoring tool). These elements would be integrated into Wordpress (as a plugin) or Elementor (as a widget) as part of the build phase to ensure their use is also entirely manageable in-house.

How to use this mock-up

All the pages in the mock-up are implemented so you can navigate freely around the site, or use the headers in this popup to learn more about specific elements. Most pages are wireframe layouts, and all text is placeholder Lorem Ipsum – the intent is to show a potential structure of the site with various UX and quality-of-life improvements.

You can refer back to this popup at any time by clicking on the question mark icon on the bottom right of every page.

Information Archtiecture

The current site lacks clear structure in its organisation of content – we have organised the page structure into more clearly defined categories which allow a user to more easily understand the relationships between the organisation’s operations and the work it does.

Though this is only an initial concept and is based on the existing content, it shows how creating structure for the various types of content allows the site to become more easily understandable and navigable – both for users and for search engines and SEO. 

Main Menu

The changes are most easily visible in the main menu, accessed by clicking the 3 bars in the header. There are many ways to present this data – it is equally possible to have main menu headings visible in the top bar, but this route allows for more top-level items as they are not restricted by the width of the page.

Within the menu, clicking on the left-hand list shows sub-categories and pages, alongside specific elements of content that we have chosen to highlight. All of this content is easily edited using Elementor, allowing you to (for example) change the highlighted content at times when there is a specific element you want to draw attention to.

The content is created and managed entirely within Wordpress and Elementor – training for all elements of site design is included in our quote.

Overview

The elements of design we have included here are intended for laptops and monitors (see also Mobile-first Design). The page layouts are mostly simple wireframes but use some examples of actual design, for example different header (also called ‘Hero’) layouts. The homepage also includes other on-page elements of interactive design.

Quality of Life Improvements

Elements we have added include:

Page Transitions: clicking on a link shows a page overlay with the site logo, reinforcing the brand and giving the user clear indication that a new page is loading.

Iconography: We have added icons to the main menu navigation and elsewhere on the site. The icons are simply added within Elementor and can be placed anywhere in the site’s content. The icons come from fontawesome (see here), which has a huge library of icons and styles.

On-page navigation: for pages that have a clear section structure we have added on-page navigation (eg here). This allows users to navigate between sections by clicking the relevant icon rathet than having to scroll through potentially long content-heavy sections to find the information they are looking for.

Well-being Goals

We have implemented the graphic of the Well-being Act’s 7 goals as an interactive circle showing the goals

WPML

Translation is handled by WPML, the most widely used and feature-rich Wordpress translation tool.

You can switch between languages using the dropdown in the site header (the design of this can of course be fully customised). Though it is not anticipated in the brief, any number of additional languages can be added if required.

Automatic Translation

WPML has an automatic translation feature, which we have used in creating this mock-up. Pages can be set to be added to the translation queue every time they are edited – though there is a small cost for the automatic translation. All translations can be edited easily inside Wordpress at any time.

Manual Translation

If you do not choose to use automatic translation, all content can be translated within Wordpress manually. WPML provides a simple interface for this and tracks all translations, notifying you if there is content which has not been translated (and allowing you to use the WPML translation service on any individual text element where required.

GA4

We would set the site up with Google Analytics 4, the most broadly used and comprehensive analytics service. All set-up is included in the quote, including creating micro and macro conversions according the the KPIs established in the discovery phase.

GTM

We would fully integrate GA4 with Google Tag Manager, adding custom tags to page and template elements to track user behaviours and analyse the efficacy of different page designs, allowing you or us to optimise the site’s layout and features to ensure smooth journeys from landing pages to conversions.

A/B Testing

Elementor’s ‘conditional display’ functionality allows for A/B testing (also called Split Testing) for specific elements, randomly displaying one of a selection of conversion elements (eg a button or a form) to establish which elements perform better.

User Reporting

We have added a simple example of ‘user reporting’ – effectively a poll element which allows users of the site to submit feedback quickly. You can see an example at the bottom of the page here (please note the functionality has not been implemented).

Cookies

Heading

text

Heading

text

Heading

text

We have added the CookieYes cookie manager plugin (cookieyes.com), which we use as standard on all our client sites. It provides a comprehensive and free solution to GDPR and worldwide cookie consent, with an easily customisable cookie banner, in-depth reporting and controls, and automated site scanning to ensure all on-site cookies are included in the consent options.

Security

Our hosting partners Mythic Beasts (see here) provide comprehensive security and firewall options and our packages with them include fully-monitored server management with a 99.99% uptime guarantee and 24/7 support and recovery. We can configure the site to have any required level of security – this is included in our quotation.

Heading

text

Heading

text

Heading

text

Reporting

As part of the hosting and ongoing support service package we will provide monthly reports on the above, allowing you to easily monitor the site’s activity and optimisation against the KPIs.

Heading

text

Heading

text

Heading

text

Heading

text