Lightmaker (Bomb Project) – Invictus Games Website – Finishing the Design (Part 2)

Today I returned to class with the goal of completing the remainder of the project which I began previously, which was thankfully able to do, leaving me the rest of the following weeks to do my FMP project undisturbed.

I started todays session off by finishing the exploded diagram mock design, which was made using a pre-excsiting image as an example and labels created by myself for the information as well as custom made rotation arrows for added effect. This feature was added to the site as to the client’s demand for making the site more focused around the car itself, and what better way to do that by allowing viewers to virtually explore every part of it.

After that I moved my focus onto the drivers themselves, considering that the event itself is more about those who have come to race. For this part I found an image from the site’s library of images for a placeholder image of all 4 of the drivers together, then used  depicted what could be seen as a select screen for each racer. The idea behind this design is that the user can select a driver from the image and be greeted with information about who they are and why they are here (while the remaining drivers are darkened out). This feature would be used to help build a emotional response from the reader by letting them understand the motivations and build interest, but in a way that doesn’t force the information into their faces, as the information only appears upon clicking the drivers.

For the next feature I wanted to add a simple gallery feature as I found a large collection of photos for the event on the Invictus Games Racing website, so having a place to put these photos on my own version seems obvious. To do this I simply sectioned off a small area under to the racer section and created a banner-like design with tire-track patterns. Within it I placed 3 photos in what would be a preview section, which would allow readers to view photos. This could also be expanded upon by by making the title of the design send users to a gallery page.

Finally I created the area at the bottom of the homepage where the viewers could purchase tickets for the event(s). For this area I went with a Union Jack colored stripe effect that constantly rotates, as well as a car which would slide in from off screen. The name, date and address on the left are all clickable and would open a new page with more detailed information about the event and purchase. The reason why I made this section so animated compared to the rest of the site is so that it immediately catches the attention of viewers, urging them to click it and buy tickets. With the ticket section of the site complete, I finished off with adding the social media icons on the bottom banner, keeping them to the same color theme as the rest of the site.

I am actually rather pleased with how the overall design style of this project has turned out, and with my future need for a website design for after college, this brief has granted me some much needed practice and inspiration. I do feel  a little disappointed however that I was unable to produce a fully functional design compared to some of my peers, as seeing this design in action would have been far more appealing for my client. This may need to be a starting point for me to start trying to use web design tools (possibly outside of, as having just a mock design will be enough for future clients, and using actual web design tools will give me a better understanding of what I can and cannot achieve for the finished product (as it is hard to know without experience).


LightMaker – Final Presentation

Today we held the final presentation for the LightMaker project, showing our ideas to the clients to receive their feedback on our ideas and presentation of them. I presented my design ideas in the form of PDFs, as they were an accepted format for the presentation, allowed me free control over their size and because I saw the use of a power point being a bit unnecessary for just 3 images.

The presentation itself went fairly well, with no technical errors from the files/computer and no (not many) errors on my half. Not to mention that there were no negative reactions from the clients that I saw. After the presentation the clients gave me some feedback on my ideas as a whole. Overall, they seemed very pleased with my designs, saying that they really enjoyed my “artistic” take of the webpage designs. Like me, they also shared a good bit of enthusiasm for us taking an artistic take on how to design their webpages, as liked the amount of animated features I put into my plan.

Namely, the only negative comment they had to mention was about the speed of the “Tankopedia” page, as they questioned how it may make seeing the tanks a bit lengthy/repetitive, to which I completely agree. The only real thing that I can think of in order to prevent the animation from becoming too repetitive and lengthy is to simply speed it up to a quick yet still understandable speed.

Other than that, the clients were pretty happy with my work, as well as myself. Despite only being a week long, I have quite enjoyed the time doing this project as it has given me a bit of a refresh on the web design industry.

LightMaker – “World of Tanks” Website (Bomb Project)

Today we have begun a brand new bomb project presented by a very professional design company known as LightMaker, who have asked us to help create mock website designs for the “World of Tanks” computer game.


They have asked us to create a dock/concept design of a suitable website which hammers in the main message to potential players that the game is free-to-play. The way we show this message and website is entirely up to us, as we can (like a pair of trailers shown to us during the prevention of the project) make the website either about the shooting and fighting part of the game, or give it a more sympathetic design that shows the conditions of the soldiers themselves.


We have also been given the option to choose how we wish to present our ideas, as we can show them as either a concept sketch, storyboard or an actual website. I am currently thinking of solely concentrating on creating the concept and storyboard design presentation style as having only one week to think of, design and create an entire (or even just most of) a website seems far too pressuring as of the moment, not to mention that I do not think that I am currently capable of creating high quality websites as of yet.

List of Sources:

Web Design – Final (Evaluation)

After now having completed the final page of my website, I shall now give my full view on haw I feel about this project result.

(link to site:


I have really enjoyed how professional you can make a site using something like Wix, as I (personally) believe that I have created a decent looking site that can possibly use later on in life for my work and/or my career. I really like the use of colors that I gave to the piece, as I believe that the use of bright friendly colors is very appealing towards the site and gives the pages a very comforting tone.

The use of animated backgrounds was also a very interesting and unique feature that I had yet to see or even think about when originally planning/researching how my site would be, and the use of that animation being a person doing illustration simply promotes my personal specialty within the site (as I see my strongest and most favored art skill as being illustration).



I am honestly a bit unsure on whether or not my uses of animations within the site are in any way necessary for its design or function, and I am a bit concerned on whether or not the animations (despite not causing any issues on the computer systems that I have been using (so far)) may cause the computers of users to lag or slow down upon entering the site. I feel as if this potential problem may be a bit hypocritical of me as I mention before that would try to be cautious of potential lag problems. I may have to change these features should I receive any notice from users that they are experiencing speed problems.


I found the feature of a contacts option built into the footer as a very interesting feature that I do not believe I have seen on any of the previously reviewed sites during this project, and how its presence saved me the trouble of having to create an entire page (possibly even one that would have the empty-space syndrome I have mentioned before) just for an email option.


Overall I have found this to be a successful project, as I believe that I have reached the goal of creating a functional website that will help greatly within the future as a personal work platform for displaying and promoting my work to businesses and other people alike. While I know that there may be things that may need more focus and work to complete, I feel that there is plenty enough in order to be a functional website personally for me.



Web Design – Making the “About Me” Page (Final)

Today I have finished creating the page which will serve as my personal bios/artist info for the website.

I was inspired to create an “about me” page after seeing how many of the sites I reviewed previously had a page dedicated to telling viewers about themselves and giving an explanation of what they do or specialize in. I also noticed how annoying it was when I found the sites that did not have an “about us” page (or an bios page that contained no information about their specialty), as it left me in the dark a fair bit about what exactly they did within the design industry.

So, I decided to create an about us page for the sake of giving users the ability to understand who I am, as well as what I believe I can help them with for their business.

The Page contains only just a few paragraphs of text with information about me and my skills, with an image of what will be my photo. I have only done a few smaller paragraphs for the bios as I believe that while it is important to have a bit of information about yourself, too much information may make you look awkward and full of yourself or discourage users from reading the whole page. A few detailed (small) paragraphs will probably be enough to tell anyone what you do without much trouble.

After completing this page however, I noticed something that I had not seen before, or at least, not for a while. I noticed that I had been unknowingly avoiding the most annoy issue that I found back when doing my website research, the amount of empty space on each page. Thanks to the combination of the contacts footer bellow and the easy ability to re-size the page itself to fit with the headers and footers, I had been preventing the annoying trope of unused/unnecessary space located around the page, something that I had seen a fair bit of during my research. Because of this, I am even more glad to have chosen as my site creator for this project.

Web Design – Making the Blog (Link)

The third page that I have created for my website is the blog page.

However, unlike the previous pages which were linked together within the new website, the blog has been made separately from the site, and has instead been redirected to this blog located within WordPress. I have done this by simply making the blog page become classed as a “link” rather than an ordinary page or sub-page when I was creating the page at first.

I originally planned on actually using the ready made blogs on the Wix library much like I did with the gallery designs, however, after thinking about how difficult it would be to manage both the website blog and my main WordPress blog at the same time, I decided to drop the idea of having a blog page completely, until I found out about the page links.

Do to there being no physical page to talk about, I will just simply say how happy I am to have used the page link feature, as it now means I can have a functional blog on my site for viewers to read, while not having the complexity of managing two on separate sites.

Web Design – Making the Gallery/Work Page

Today I have finished completing the layout of the Main gallery, where the main majority (or all work in general) will be located within my site. The gallery page will serve as the main storage/archive of all of my past works during this course up until now.

Since the overall design theme of the website has been carried around to all other pages of the website, I did not need to worry too much about doing any major designing on the gallery page, so I could focus solely on the creation of the layout itself.

Oddly enough however, already had a large variety of gallery layouts for images within it’s asset library, each with their own styles and layouts, meaning that creating a gallery page was a lot more easier than I first thought.

I decided to use one of the more basic layouts (simple boxed thumbnails) as I want a neat and tidy layout for my gallery, and the various other layouts and designs (despite all being very interesting and good looking) did not fit well with the general style and size of the website pages.

Along with the main gallery for all of my past designs within the course, I also decided to included a selection of other sub pages to go along side the main page, with each one containing an enlarged version of each image which will/may have some text under it to give an explanation on what it is as well as some of personal thoughts on each piece. These pages will basically serve as annotations for all of my major works that I have chosen to display. (note: I may decide to remove these pages (or just the text) within the future as I am still a little unsure on whether their presence is necessary for the website).

I am quite happy of how the gallery page(s) have turned out in the end as they neatly display my designs in an orderly fashion. I am still a bit surprised at the option of creating galleries from nothing, but I am happy for the option being there as it has help save a lot of time trying to create one (or several) from scratch.



Web Design – Making the Home Page

Today, I have begun and finished creating the home/main page of my website, which will act as the hub page of the site, containing all of my most recent works at this current time within the project. Here I will talk about the page I  created as well as how and why I choose to design the home the way it is.

Being the most obvious page needed within my site, as practically every site in the world (not just the sites I reviewed) has some form of home/main page that serves as a main hub for their website, I created the home page with the intent to make a functional core of the website. The page will contain all (many) major and/or minor links that will branch out across my website (and possibly onto other websites as well).

Most of the work that I did when creating my website was mostly done from pure improvisation due to my lack of experience within, meaning a lot of the layout work and design choices were made from finding them from the web designer itself, where I chose to use certain aspects based on whether or not I liked the look of them and wanted them on my website. I feel like (despite what many would think) that this method of choosing the design right on-the-spot would be much more easier than trying plan the design of the layout prior to the work, only to be disappointed if I couldn’t do various things I had hope for.

Staying with my idea of creating a personal, fox-themed design, I made the color-scheme of the site a mixture of oranges, whites and blacks (black instead of the realistic brown as the use of a murky brown would probably look not so nice on such a brightly colored screen compared to the more solid black). I kept many of the default layouts of the page the same due to them actually being place or designing in ways that I found particularly useful to the sort of design aspects I would expect from a designers sight (such as the immediate ability to contact the designer on any page).