Posts

Showing posts with the label Personal Projects

Changing a web page's style based on the time of the year

Image
A fun gimmick that I decided to look into is changing a web page's style based on the current date of the year. Making a page look more frosty when its winter would make for a fun interactive feature that I think would appeal to most. The solution to this simple gimmick was to use  CSS custom properties / variables , which allows for different values to be stored and used throughout the CSS file. For a basic web page, variables for the background colour, text colour and a filter for the background image were created (since the filter property will affect all children elements, the background image has been put into a separate div under the 'body' tag with a special 'bg' ID). These variables can be referenced using ' var() '. Then for each unique page style I wanted, I created a new class that modifies the CSS custom properties. CSS classes for the default (root) style and page styles. Now all that's left is to implement some JavaScript that will determin...

Level select movement inspired by 'Super Mario Bros.' - In Roblox

Image
Game development has been one of my big interests while learning programming. Roblox, a massive online game platform, provides an environment for developing games easily called ' Roblox Studio '. It has its own game engine and uses the programming language ' Luau ', Roblox's version of Lua that implements extra features for better integration with the game engine and to allow creators on the platform to have more control over their creations. A small system that I decided to try and create is the movement for a level select inspired by the 'Super Mario Bros.' series.  Level select movement example from 'New Super Mario Bros. Wii' To be able to create such a system, I first needed to figure out how I would be able to distinguish levels from each other. The simple solution was to assign 'Level IDs' to the parts that would act as the gateway to each level. When you select an object in Roblox Studio, you get access to all of its properties and yo...

'Bean & Brew' Website Design

For me to complete my college course for 'Digital Design and Development', skills in web design and development were needed for the final exam. For this I chose to work on designing a website for a coffee shop called 'Bean & Brew'. The features I managed to implement into this basic design includes: A header and footer than update globally As long as the script exists on a page, a header and footer will exist Can be edited and updates to all pages automatically A home page JavaScript is used to create a functioning carousel of offers, however it only works by the user manually progressing through it with the buttons provided. A menu of items JavaScript is used to display different categories in this menu. An ordering page No functionality, just to show how it could look when working. An offers page A locations page Uses a Google Maps embed to show a marked location. A jobs page A search bar Does not work, scales with the width of the window. Sign in and sign up page...

Scalable grid with input for 'Tic Tac Toe' - In C++

Image
For one of my assignments for my programming module, I have been given the task of creating a 'Tic Tac Toe' game in C++ with many additional improvements and features added to the base to show my range of skills and my creativity. For this program, I have created a function that will display a grid of any size, where the row length is always equal to the column length, and can take in input that will also adapt to the size of the grid. Displaying A Grid Filled With Values  This is a screenshot of the 'DisplayGrid' function. It is responsible for displaying a grid that is been filled in with what the players have inputted previously and will let the players decide their next move. Each line has been commented to explain what they do and what the next lines will be doing. In a quick summary, the function starts off by initialising a variable called 'currentColour', which will store the colour of the current player's symbol to apply to the cell. It then loops t...