• Home /
  • News Article

Introducing The Temperate Zone

The Temperate Zone - this system within a system is designed to be infinitely expandable and intuitive to use.

Marine Discovery Team

MDC team

Feb 2, 2018

Our new site design has at its core a unique feature The Temperate Zone. A research facility for students and teachers focussed on the Temperate Zone's marine life.
This system within a system is designed to be infinitely expandable and intuitive to use.
The site was created with the benefit of a team including PhD qualified researcher Dr Steven Gration who refined the concept of themes and researched specific content eg Dunes Natures Way of Defending Coast. MDC resident marine biologist Jacinta provided excellent guidance and perspectives on the sea creatures inhabiting the Temperate Zone.
An iterative development style ensures 'discoveries' can be incorporated into the site even on launch day and beyond. All stakeholders contributions can be added efficiently with this flexible approach to development.
Graphics and concepts were provided by JP Media with the development, games and coding provided by Gold Coast Login. Read on for some technical details of the new system and demonstrations of some presentation features.

" The Temperate Zone research material is unique to Australia.
— Tim Hoile, director MDC

The Core System

The new site uses the latest version of a software system that has a very large team of excellent developers. Having experience with this system allows faster development time using tested components. Hence as a developer I explore that system and further refine it for the MDC site. However, this comes with a knowledge of previous versions and a technique that layers a new site on top of an old site - replacing parts of the front end system but only minor changes to the back-end

Exciting ways to present information

This approach means versions are layered on top of each other - future improvements to the back-end can replace one component not the whole system. This system approach goes all the way to the server set-up, database, security and emails. It simply means a discovery or improvement can be added to any site that has this back-end.

Optimised Code

The code is optimised on a page by page basis - systems like Word Press do not do this - they often load everything on every page making them very slow.

Temperate Zone

The Temperate Zone section is designed to be a separate stand-alone section (in fact this could be moved to any site if necessary with minimal changes). It uses icons for recognition with a Masonry style to break up objects into different sizes yet maintain a clear message. Search function is designed to allow people to find things quickly and intuitively. We have incorporated Google Maps v3 that uses clustering combined with Fancybox, Panoramas and completely replaces the Flash dependent Trail.

Fancybox v3 is used creating beautiful pop-up boxes, video, images, pdfs (that display as pop-ups). eg Read more about the MDC

We have adapted this site to use Fancybox for slide shows even from the home page if a news items has a slide show.

Audio can be played in browser native devices - instead of Flash.

Game developed in Snap SVG meaning it can play on any device.

Vector graphics used for pdfs so that images scale well.


All videos are played from Vimeo or YouTube these are not downloads from the site and do not incur download fees.

Design Framework

The Framework Bootstrap 4 - produces device adaptive styles (items look good on various screen sizes automatically) eg mobile phones

Validation - User Feedback

Validation - our own form validating system is combined with styles that give a user realistic feedback rather than 'you have an error'.
We can state things like your date needs to be before 2019 - so the user can quickly enter information. The Booking System displays a calendar with available dates.

Future Changes

Other Changes and improvements -:

  • The colour scheme is changeable from one location
  • Once the site is complete we can further optimise it by removing style code we do not use

Innovative use of Images

These 4 images of the Amazing Cuttle Fish which can be used in 5 different ways utilising the power of the back-end of the site-:

1 As a slide show click camera image at top of page (even on home page)
2 As a Cuttle Fish Presentation
3 As a single image in a news article as per the top of the page
4 As an item in a Quiz
5 As an Animated Gif below

Cuttlefish presentation


Other Articles

Aug 26, 2019 Moray Eels - new additions to the MDC
Aug 8, 2019 Native Oysters cleaning our water
Nov 30, 2017 Fund My Neighbourhood Grant Win
Nov 22, 2017 Jacinta features on Totally Wild
Jun 23, 2016 MDC in parliament
Apr 11, 2016 Federal Minister for Education visits the MDC
Dec 7, 2015 Newsletter 4 (Dec 2015)
Sep 18, 2015 Newsletter 3 (Sept. 2015)
Apr 29, 2015 Newsletter
Sep 19, 2014 Newsletter - Dr Barbara Hardy AO
Jun 26, 2014 Newsletter - Marine Debris Workshop
Apr 2, 2014 Newsletter - We are thrilled to announce ..
Dec 10, 2013 Newsletter Dec. 2013
Sep 24, 2013 Newsletter Sept. 2013
Sep 5, 2013 The
Jul 24, 2013 MDC featured on Totally Wild Channel 10
Jul 1, 2013 Our MDC Student Leaders received an Award
Jun 21, 2013 Newsletter
Apr 9, 2013 Newsletter April 2013
Jan 30, 2013 Hon Greg Hunt MP visits our MDC
Dec 10, 2012 Newsletter Dec 2012
Nov 9, 2012 MDC wins State Award
Sep 11, 2012 Newsletter 3 Sept. 2012
Sep 7, 2012 ABC Radio Interview
Sep 6, 2012 Marine Centre wins 2 NAB School First Awards
Sep 6, 2012 Marine Centre wins 2 Awards
Jun 29, 2012 Newsletter 2 June 2012
Apr 2, 2012 Newsletter 1 April 2012
Apr 2, 2012 Marine Centre's new Ambassadors
Dec 12, 2011 Newsletter December 2011
Nov 11, 2011 You can now donate online to our MDC
Sep 30, 2011 Newsletter September 2011
Sep 30, 2011 Video Clip of our Models
Jul 5, 2011 Newsletter July 2011
Jul 5, 2011 You can now advertise in our Newsletter
Jul 5, 2011 Newsletter 1 March 2011
Mar 15, 2011 Where Does Seafood Come From?
Feb 9, 2011 Crabs on Henley Beach
Sep 17, 2010 Newsletter 3 - Thursday Island MDC visit
Sep 1, 2010 Tax Deductible Donations
Aug 12, 2010 Coastal Signs launched at Yamba
Jul 2, 2010 Newsletter - World Oceans Day
Mar 30, 2010 Marine Centre Officially Opened!
Oct 26, 2009 Marine Centre supports new Idol
May 26, 2009 National Pharmacies helps Marine Centre
May 26, 2009 View Virtual Walking Trail
May 7, 2009 Marine Centre grant win!
Aug 28, 2007 Prime Minister visits Marine Centre
May 2, 2006 World Oceans Day Resources released!!!
Feb 20, 2006 Seaweek Quiz launched!!