Ariana Palmer
UX/UI Designer & Illustrator

Dream Design


For this assignment, we had to create a fictitious design company and create a webpage. This was a solo project of which we had to make a design and then code it into fruition to ensure that we were able to follow our design layout using divs, header, footer, body, etc.

Software: Photoshop (to design the layout), Dreamweaver/Notepad (to write down the code)

Code Languages: HTML, CSS, JavaScript

This assignment really challenged me to have good attention to detail when it came to the code breaking, but it was fairly easy and fun to do.

Dream Design

The Design

This is the final design of the concept after everything had been laid out and stylized. You'll notice there's also coloured rectangles surrounding specific areas within the design; this is to show how I ended up separating each section into nav, header, body, footer, divs, etc. in order to figure out how the design should be coded.

Once the design was done, I went ahead with the HTML and CSS of the website to get it done as best as I could with the styles for typography, imagery, etc.

The logo is just a typographic logo done with a script font called "Sail".

The footer includes proper copyright to the fictitious website, along with links to their privacy policy along with terms and conditions.

Sections included are: navigation, hero, about us twocol, their strategy, portfolio gallery, services threecol, design team, and the form for contacting them.



While I do think this was a really good start in my first year of Graphic Design at Fanshawe, I also think that this will be another future re-vamp project. Looking back on it two years later really allows me to see how many flaws there are that have room for improvement; the general layout can be re-done a bit, the colour scheme needs to be done with more professional colours as compared to the vibrant neons going on, and text needs to be re-aligned in a way that's consistent. I would also want to re-make the logo just so that there's an equal distribution of visualization and typography to it.

Otherwise I think that this assignment was definitely a good start. It at least allowed me the ability to work more with coding and understand the use of columns more accordingly.