Website: Contact Me Page
In today's Digital Arts class, we focused on creating and customizing the 'Contact me' page. I already started customizing my website so I knew that I was going for a bright, minimalistic theme that consist of greyscale colours and a bright lavender to contrast. Identity and consistency are very important factors for websites, therefore, I wanted to maintain the same theme throughout.
The 'Contact me' page before I customized it had a dark background and white coloured letters. I find the colour black to be very tiring to the eye and I wanted to make my page intriguing and aesthetically pleasing. I decided to remove all the information placed on the page so I can start off with a blank canvas and customize it to my own liking.
The first step was to remove the information and background. Although it is suggested that we use a plain coloured background, I decided to add a bit of texture. This page will not consist of a lot of information or detail so the background won't interfere with the text. I used marble as it clearly follows the theme that I chose for the website, consisting of many grey and white tones. I clicked on 'change page background' and it was one of the top 10 images that popped up in the 'selected backgrounds'. I liked it and chose that one.
Marble is a material used in many products designed, therefore, it can be indirectly linked to my progression route.
I was planning on keeping the background a plain colour, however, I wanted to make it modern. Marble is minimalistic and simple, without a lot of texture.
After choosing the suitable coloured background, it was time to edit my font and add the contact form. I used the font called 'DIN Neuzeit Grotesk' in 'Heading 4' throughout my website. This linked all the slides together and made my work look more cohesive. I adjusted the colour of the 'contact' text to black in order to make it stand out and then placed it on the top left corner.
After that, it was time to add my contact form. I had a lot of options to choose from but I was in between the first 4 options that popped up.
The first option was a very basic one. It didn't really inspire me to include it into my website as it is not unique and interesting. The second one really interested me as it has a very nice display and layout. However, as my name on the top of the page is included in a rectangular box, I wanted to keep the same theme and include rectangles.
Therefore, the last 2 designs were the most interesting in my opinion. I decided to proceed with the third one as the box of the 'submit' button is also rectangular to maintain my symmetrical theme. I clicked on 'add', then 'contact& forms' and then dragged the form onto the page.
Once I added the form into my page, I started customizing it. The first step was to change all fonts to 'DIN Neuzeit Grotesk' in 'Heading 4' and adjust their size to make sure they fit well within the grid. Later on, I changed the colour to the lavender that I used in the homepage. I feel like this step was crucial to make my page look nice and neat. I added a black border to the boxes as a means of resembling the logo with my name on the top left corner of the page. I like adding details of consistency throughout my pages and I am really happy with the overall result.
On the top right, I decided to add social media links. However, I will not be adding any personal social media for privacy reasons. Therefore, I decided to replace that with a blogger link as a means of people checking out my blog. I clicked on 'add' and then 'social'. I dragged the social bar onto my page and then clicked on 'set social links'. I removed all the existing icons and searched for a blogger icon by clicking 'add icon'. I had 6 different options for my blogger icon. Ideally, the design I wanted to include was the second one with the grey background. However, it was included in a circle, not a rectangle and that would interfere with my theme. I chose the first one and added it as it was the only one that was grey.
I also added a phrase that said 'You can also check out my blog!' in order for people to spot out the social media icon more clearly. I used informal language and an exclamation mark to make it user friendly in order to make people feel more welcomed. The exclamation mark also shows excitement which suggests that reading my blog is something exciting.
I added it to the top right corner to attract the users eye immediately and make them more intrigued to click on it.
Additionally, I added a short sentence as a means of encouraging people to contact me if they have any issues. I used the pronoun 'me' to make it less formal and more personal in order to encourage people to contact me and make them feel welcomed.
Lastly, I added the textured lines at the bottom of my page as a means of linking it to my home page. I liked this element and kept it in my own website as it breaks the symmetry that's going on in the page. There are many rectangles throughout the page, therefore, adding the lines kind of breaks the theme of my page and makes it more unique and interesting.
Overall, I am very pleased with how my 'Contact me' page turned out. I think the identity is the same throughout and there is a lot of thought behind the creation of this. Including elements such as the boxes, the textured lines and the colours will ensure that my website looks neat. I could add a picture that would make it look more aesthetically pleasing. I am still constantly developing and improving my work so my overall layout might change in the future.
Very good process and commentary here - I wonder if an image would make this page more interesting ..
ReplyDelete