blahCreative mind, passionate about design.
Professional Designer & Programmer
Brisbane, Australia.
Matthew Lord
-- Creative mind, passionate about design. --
I started creating web pages at the age of 13 and since that day I have been hooked. I started a 3D rendering and web development team originally called Fourth Dimension and later became known as Missing Link Designers at the ages 14 and 16 respectively.
I am hungry for knowledge while constantly developing my design & development skills. I enjoy learning and sharing what I have learnt along the way with others. I thrive on challenges and I constantly try to improve my techniques and tweak my design process.
Contact Me
Whether you need a project created or just want to get in touch, I would love to hear from you. Feel free to give me a call, email or send me a letter.
-
-
-Proficiencies
- HTML
- HTML5
- CSS
- JavaScript
- jQuery
- ES6
- Node.JS
- React
- React Native
- Redux
- PHP
- SQL
- JAVA
- ASP.NET
- C#
- Python
Jenn & Matt Wedding
- A web wedding invitation to accompany a physical invitation -
Jenn & Matt Wedding
Languages: HTML, CSS, JavaScript, jQuery
Tools: Adobe Photoshop, Atom.io
Started: December 2017
Completed: January 2018
I wanted to convert our physical wedding invitations which were made by a Philippines based company into a website which they can also view as the physical invitations were going to be delayed.
This ensured people were able to RSVP on time for the wedding while still providing the same design we liked with the physical invitations.
Maxo Telecommunications
- User portal to allow users to configure their phone system -
MaxoTel
Languages: HTML, CSS, PHP, MySQL, JavaScript, jQuery
Tools: Adobe Photoshop, Notepad++
Started: November, 2015
Completed: January, 2017
This project was a complete overhaul and rebuild of the current user portal that clients use to manage their VoIP system. The old system used vanilla PHP with very minimal AJAX. The pages refresh when posting form data and the system is very clunky. I have completely changed from that approach to using AJAX to load in content and switch between pages. This allows for smooth updates of content and navigation through the various pages. Instead of refreshing the page after updating content, the appropriate areas are reloaded with AJAX to look as fluid as possible.
Part of this project required multiple custom build jQuery plugins. A filter box was created to hide select boxes and allow users to search the select box content however they also needed to be able to search by custom keywords and categories, hence the reason for a custom build.
NOTE: There is no viewable live production website for this as an official account is required.
Cane Toad Challenge
- A mobile phone application to help assist in collecting data about baits -
Cane Toad Challenge
Languages: Xamarin (C#)
Tools: Adobe Photoshop, Visual Studio
Started: August, 2016
Completed: November, 2016
The Institute for Molecular Bioscience at UQ required an application to help assist their world first bait that they created to help people set them out in their dams or ponds to attract cane toad tadpoles. It gets the bait information including the GPS location and places this in a database.
In this project I designed the mock-ups, created all the front-end UI code in Xamarin as well as assisted with the code for communicating with a REST API.
Buhay Aussie
- Migration blog to assist migrants from the Philippines -
Buhay Aussie
Languages: HTML, CSS, PHP, MySQL, JavaScript, jQuery
Tools: Adobe Photoshop, Notepad++
Started: April, 2016
Completed: June, 2016
This project is a blog/information hub for people migrating from the Philippines to Australia. The website is a fully functioning blog which allows site administrators to create and modify blog posts using a purpose built portal. Site users are able to post comments on the various blog posts.
I created an image/post slider plugin from the ground up using JavaScript/jQuery. This will be available to the public for download in the near future.
To enable SEO friendly URLs, custom .htaccess rewrite rules also had to be written.
Physical Portfolio
Physical Portfolio
Tools: Adobe InDesign, Adobe Illustrator
Completed: 2016
Over the course of my degree at university I had to create illustrations about facts. All of these facts were put together into a physical portfolio book.
Human Eye
Human Eye
Tools: Adobe Illustrator
Completed: 2016
One of my pieces of assessment at university I had to create an infographic about something of my own choice. I decided to choose the topic of the human eye as this is an interesting topic to me.
The Living Room
- Interactive living room to explore the Australian contribution to major wars -
The Living Room
Languages: HTML, CSS, PHP, MySQL, JavaScript, jQuery
Tools: Adobe Photoshop, Notepad++
Completed: November, 2014 (3 month project)
The Living Room is a project I worked on in one of my courses at University. We were given the National Library of Australia (Trove) database to utilise and create a web based application that uses the data in an interesting way. This was a group project and one of my team members came up with the idea of using data of the Australian contribution to major world wars and creating an interactive living room. I designed all the user-interfaces and I created and implemented the entire application.
I created custom-made JavaScript Masonry functionality similar to this plugin for the newspaper clippings to appear stitched together and I will convert this into a plugin for public use in the future.
Experimental Portfolio
Experimental Portfolio
Tools: Atom.io, Adobe Photoshop, Adobe Illustrator
Start: Early 2017
I wanted to experiment with a new portfolio and explore unique ways to use JavaScript and CSS. This project was inspired by http://www.species-in-pieces.com/ which uses CSS3 polygons however this only works in Google Chrome. I wanted to make my design work across browsers so I implemented it using borders and CSS transforms.
NOTE: Please remember that this is a work in progress and the website may not be fully functioning.
DSITI - Rainfall Maps
DSITI - Rainfall Maps
Tools: Adobe Illustrator
Started: Early 2017
The Queensland Government Department of Science, Information Technology and Innovation require a website to show the difference in rainfall over the last century. They need to be able to show people this data in an easy to understand way and allow people to make various life decisions based on this data.
NOTE: Please remember that this is a work in progress and the website may not be fully functioning.
Percentage Circles
- jQuery Plugin -
I have created a variety of jQuery Plugins over the years which can be incorporated into your website using the latest jQuery versions. To use them, just copy the code and choose your settings and away you go.
Percentage Circles
Code Example:
<link href="pcirc.css" rel="stylesheet" /> <script src="pcirc-1.0.min.js"></script> <script> $(document).ready(function(){ $(".pcirc").pcirc({ primaryColor: "F74F4F", percent: "40", animate: 1, animateTime: 1000, }); });</script> Draw SVG
- jQuery Plugin -
This is a long description about what this plugin is and what it is for... Write lots of details here so the user knows how to use it and what it does.
Draw SVG
Code Example:
<svg id="drawsvg"><g><path d=" M 41.00 99.00 C 41.06 66.29 40.89 33.57 41.08 0.86 C 43.28 4.30 45.81 7.51 48.26 10.77 C 65.55 33.84 82.95 56.83 100.14 79.97 C 118.20 56.03 136.17 32.01 154.19 8.04 C 155.89 5.84 157.54 3.59 159.00 1.22 C 159.00 49.81 159.00 98.41 159.00 147.00 C 172.66 146.73 186.33 146.95 200.00 146.88 L 200.00 170.00 L 136.00 170.00 C 136.02 139.98 135.97 109.96 136.03 79.94 C 135.96 77.94 136.33 75.78 135.13 74.02 C 123.68 89.82 111.81 105.31 100.13 120.94 C 88.53 105.19 76.74 89.57 64.99 73.94 C 63.77 75.37 64.01 77.26 63.97 78.98 C 64.03 93.32 63.98 107.66 64.00 122.00 C 42.67 122.00 21.33 122.00 0.00 122.00 L 0.00 99.00 C 13.67 99.00 27.33 99.00 41.00 99.00 Z" /></g></svg> <script src="drawsvg-1.1.min.js"></script> <script> $(document).ready(function(){ $("#drawsvg").drawSVG({ outlineColor: "168b8b", outlineWidth: 2, fillColor: "f74f4f", drawTime: 2000 }); });</script>