Home

In our first session for digital Sylvia gave us a presentation about creating and designing a website. The presentation was all technical so it was little hard to understand.

img_0941

From this workshop we will be learning to create our website using wordpress.  There are two kind of wordpress. They are “wordpress.org” which is self-hosted and the other one is wordpress.com which is not self-hosted. We have to get domain name and a host to create our website. To get that we have to pay for it and you can go to http://www.siteground.com or https://tsohost.com to create one. It was really interesting for me to find out that .com, .net, .co.uk we have to pay for it to have one.

Screen Shot 2015-05-15 at 11.24.30

We were given our domain names from our tutor for academic use. My domain name is http://webfoyr.wecreatetogether.co.uk/anita

Sylvia told use to bring a theme idea to create our website. we can go to www.awwwards.com for design idea.

To choose a theme, we can download from website. we have to type “free portfolio wordpress themes and choose any one we like and download it. The file have to be zip. If the file is not downloaded as zip, to  make a zip file -> right click -> press “compress”

This is the theme that I liked.I download it on my computer.

Screen Shot 2015-05-15 at 11.39.41

 

 

To download the theme for my website -> appearance -> themes -> add new -> upload themeScreen Shot 2015-05-15 at 11.46.06 Screen Shot 2015-05-15 at 11.47.23

For my website I will make my photography and fashion design portfolio.

 

What is plugin?

Plugins are ways to extend and add to the functionality that already exists in WordPress. The core of WordPress is designed to be lean and lightweight, to maximize flexibility and minimize code bloat. Pluginsthen offer custom functions and features so that each user can tailor their site to their specific needs. To add plugins -> add new -> search -> search plugins -> install now -> activate plugin.

 

GIF

In our digital workshop we learnt GIF. GIF is a moving image created in photoshop. I find it creative so I will use it for my website.

To make a GIF file open a picture in photoshop. Add few more picture in different layer, you can do that by file -> place -> open.

Screen Shot 2015-05-15 at 13.03.50

 

 

Screen Shot 2015-05-15 at 13.04.03

 

To view timeline to create GIF, you have to click window -> workspace -> motion (you have to tick motion to create a gif file)

Then choose “create frame animation” and click it.

Screen Shot 2015-05-15 at 13.05.41

 

If you have 4 image then add 4 frame.

ii

Make the image visible only if you want to add the image on the frame.

uu

You can control the time of the image and how many time u want to repeat in timeline.

jj

To save go to file -> save for web -> save a gif

Screen Shot 2015-05-15 at 13.14.17

You can see the final outcome below.

top1

 

 

To make image more creative you can use photoshop to add colour or image in different ways.

Open the image that you want to work on. Add the “layer mask” to top layer  Use the brush tool and black colour and brush on the top layer to reveal the under layer image.

Screen Shot 2015-05-15 at 15.07.39 1 Screen Shot 2015-05-15 at 15.07.39 1 Screen Shot 2015-05-15 at 15.16.19 Screen Shot 2015-05-15 at 15.16.34 Screen Shot 2015-05-15 at 15.17.10

To add the different colour or the texture use “selection tool” to select the area that u wand to change. Then click at “create new fill or adjustment layer” and use any of those function to add image according to your design.  Screen Shot 2015-05-15 at 15.19.17

Screen Shot 2015-05-15 at 15.19.33 Screen Shot 2015-05-15 at 15.19.38

Screen Shot 2015-05-15 at 13.42.30 Screen Shot 2015-05-15 at 13.42.36 Screen Shot 2015-05-15 at 14.14.49 Screen Shot 2015-05-15 at 14.28.24 Screen Shot 2015-05-15 at 14.28.37 Screen Shot 2015-05-15 at 14.28.52

 

Overall it’s was good experience. In the future if I want to make my company website I have a knowledge to do so.

You can click on the link to visit my website -> http://webfour.wecreatetogether.co.uk/anita/

 

Leave a comment