Editing image for (group blog: Jonker Street) by using photoshop

Sunday, 4 September 2011

Below are the images i edited and add together to make as wallpaper for the group blog
(Jonker Street's attraction)



1.) The most left side image, i added the "dog footprint" on the floor by using the "custom shape tool".
2.) The middle image, i used (filter>texture>stained glass) to edit the beam in the image. Then i used (filter>distort>water paper) to edit the "tanglung".
3.) For the most right side image, i used the "clone stamp tool" to clone the Jumbo banner, rotate it and put it on top of the image.
After done editing each of the images, then i choose a background color (brown) for my wallpaperThen i add in the 3 images in it and align it.

For this image on the left hand side, i did not edit as i think the original image is very nice.
For the right side image, i add in "leaf" shape by using the "custom shape tool".
After edit the image, i add in text and make a column which is a little transparent at the behind of the text.


Most of the tool i used in the selection process is the "quick selection tool".
1.) For the most left side small image, tools that i used are (image>adjustment> black&white) for the background of the picture. Then i used (filter tool to filter one of the wall in the picture)
2.) For the middle image, i used filter tool to filter the background of the image.
3.) For the most right side image, tools that i used are ( (image>adjustment> black&white) for the background as to make the Henna picture look more clean and mainly focus on the Henna picture. Then i Brighten then Henna picture.
After done editing each of the images, then i choose a background image for my wallpaper, which is in pink. Then i add in the 3 images in it and align it. At last, i add in text on top of the wallpaper.

Personal Website ( The Making Process )

Thursday, 11 August 2011


Start Assigment 2!!!
Here we go~~~
First, create a new folder at desktop, and I name it as "Assignment 2", then click into the folder and name it as "html", and then, click into the html folder and name it as "images".
Secondly, Open the Dreamweaver software and create a new site and import those images into the library.


Figure 1: Create new site
Figure 2: Load all the image from image file
Figure 3: Create a new file and name it as "index.html"
Figure 4: Insert the title of the document as "Jessy Website".

Other than "index.html", I also created 5 others new folders, which are:
- bio.html 
- index.html
- gallery.html
-games.html
 - links.html
 - plans.html







Figure 5: Insert a table

I insert a table with 1 row and 1 column.
And drag the image from the library to the table. 

Figure 6: Shows the top banner of my website

Figure 7:  Align the image of the top banner to center
After dragged the image from library, i align the image to make sure it is at  the center of the site.

Figure 8: Align the horizontal cell to center
Figure 9: Highlight the words and create hyperlink
Highlight the "Home, Biography, Gallery, Games, Plans, Links" and drag the hyperlink arrow to create hyperlink. 


Figure 10: Start to make my Home page.
I add some words on top and insert a nice edited pictures into the website to make my home page more  interesting.
Figure 11: Change the page properties: "Appearances"
I changed the page properties by changing the (Page font to  Comic Sans MS), (font  size to 18), (Text color and background color)
Figure 12: Insert template
Insert > emplate objects > Editable region

Figure 13: Biography
I drag the template from asset, which follows the same pattern as before.
From the image of figure 13, the words inside the blue line of "Submenu" and "info" can be edited to whatever words you want to add in.

Figure 14: Favorite links
I do the same as before which is drag the template from asset and re-write it as my new page  : "favorite links"

Figure 15: Copyright
Below every page, I insert a table and key in the copyright symbol.


Figure 16: Codes for video
I would like to share a video of my favorite game, so i copy the code of the video from Youtube and paste it into the  page. Then the video will appear on the page.


THE END




E-wallpaper ( Collecting Original image )

Wednesday, 20 July 2011

ORIGINAL
MMU FOM BUILDING

ORIGINAL
MMU BEE

ORIGINAL
MMU LOGO


ORIGINAL
BACKGROUND IMAGE

E-wallpaper ( The Making Process )

MMU FOM BUILDING
First of all, i download a few pictures from google.
Then i started to select the part which i want to use,
by using the "ERASER TOOL > "MAGIC ERASER TOOL".

MMU BEE
This is also the same, I started to select the part which i want to use and erase the part which i do not want,
by using the "ERASER TOOL > "MAGIC ERASER TOOL".

MMU LOGO
This is also the same, I started to select the part which i want to use and erase the part which i do not want,
by using the "ERASER TOOL > "MAGIC ERASER TOOL".

BACKGROUND
This is the background which i wish to use, this image also downloaded from google.



After that, I add in the MMU FOM BUILDING into the background.
First, i crop the grass, ctrl X and then ctrl V into a new layer. After that I use eraser tool to erase the white color area, then i paste the add in the building image, resize and arrange it nicely, then only paste back the grass which i crop before this on top of the building. This is to let the building looks like its behind of the grass area, looks more real.
Besides that, I used the "BURN TOOL" on the top of the grass to make the grass  look more real.
Then, I add in the MMU LOGO into the background ewallpaper.
After that, i RESIZE it to make it smaller and put it on the right side.

Then, I add in the MMU BEE into the e-wallpaper. Then I RESIZE it.
Besides that, I brighten the picture to make the whole image look more bright.

Lastly, I add in text.
(FOM OPEN DAY) Text font: Batman Forever Alternate
(21st MARCH 2012) Text font: Arial Rounded MT Bold



E-wallpaper ( Final Work )

This is my final work.






ADDITIONAL INFORMATION:
Tools that i used during the making process:
- Magic erase tool
- Burn tool
- Crop
- Text tool