Development Process

1. Logo design:

The logo designed with star night as the background with the 2 eye balls above the hands. First, I searched all the images then open that in Photoshop. I didn’t change anything for the background, just downloaded and used it. For the hands, I needed to crop first. I was using quick selection tools because other selection tools are difficult to select/crop the hands. After the selection, I create a mask then I select again and I did the refine edge to make the selection corner part looks smooth. Then, I deselect the selection. The hands layer is finished, so I copy the layer to background part. For the eye ball part, I must crop the image also, at first I want to choose elliptical marquee tool to select the image but it’s difficult to make it round exact in image position so I chose quick selection tools again. I select the image again and I refine the edges. After that, I chose free transform because the image size of the eyes is bigger than the background so I made it smaller and applied the free transform and made a mask. Then I deselected and copied to background part. After I move the eye ball layer to the background part I need to free transform again to match it with the background layer and applied it. Because of the selection of the eye ball just had 1 eye so I duplicate the layer so now, I already had 2 eye balls. Now I repositioned the image and made the tagline below the logo. I chose the horizontal type tool then I change the type font and the color. Therefore, our team logo design has completed.

 

This is our logo design:

Remodified

 

 

2. Web Banner

There are 5 steps that I had done to make a web banner.

Firstly, I search from the internet to get a reference how to make the web banner, how the web banner looks like. It’s difficult to find the good reference for the web banner.

Secondly, I take some part of the example of the web banner to be applied to our web banner

Thirdly, I search the suitable image to be implemented at the web banner.

Fourthly, I made the web banner by using photoshop.

And the last is get the feedback from the group member and the lecturer then fixed it again.

The ways for making the web banner by using the photoshop are:

  • I made a new layer then import the image, then I select the image to resize it
  • Gradient tools was also used to make as background and the gradient tools must be fitted with the image
  • Then, I made 4 rectangle tools with different color to attract the attention and I filled with the text
  • I also import the logo image to the web banner and I put at the bottom left corner
  • I saved it as JPEG (Picture Format) and the PSD (Adobe format). PSD format allowed me to edit the file again full with the layers.

 

This is our web banner [Smileycat.com, 2014]:

Untitled-3

 

 

3. Bookmark

 

For bookmark design, there is some step to do the design.

  1. Search for example of the bookmarks and how to make it
  2. Edit the logo with Photoshop for use it for the bookmark
  3. Make the bookmark using Photoshop with add logo and other aspect

 

The step to edit for logo:

  • Open the logo file
  • Use the quick selection tool to select the part that needed
  • Go to the select>invers
  • Add mask in the layer option
  • Save the logo that already been edited to .jpg

 

The step to make the bookmark in the photoshop:

  • Make for first and second from left side rectangle with properties:
  • Give light blue color to the background

– Width : 160

– Height : 400

– Fill : white

– No Stroke

  • Make 2 rectangle with different properties with add height 100 more
  • Insert the logo picture and edit the logo picture to smaller using free transform tool
  • Copy the logo picture to put it to the each rectangle top side
  • For the first and second rectangle from left side, the logo put it in top of the rectangle and for the other two is inside the rectangle
  • Add the tagline using text box tool with properties for first and third rectangle :

– Type : Trebuchet MS

– Size : 18 pt

– Color : dark red

  • And for the second rectangle and third :

– For the word Campaign and INTI IU using red color

– Size : 18pt

– Type : Trebuchet MS

 

The background using light blue to get the reader attention and gives tranquillity for the reader to feels more relax and calm. For the word why use red, to get reader attention and to give the reader feels about positive energy and motivate the reader to take a action from the words

This is our bookmark:

a

 

 

4.  Advertisement Bundle

There are 7 ways to do the advertisement bundle

  1. Firstly, the logo has been done I saved it in jpeg and put in on one folder
  2. After that I searched in the Google the products such as: handphone, box handphone, mouse, laptop, thumb drive, and hardisk external
  3. Secondly, I opened the Photoshop and open the picture that I saved in
  4. I opened the handphone first and then I use file and place the logo in the new layer
  5. After that I resize and adjust the logo after I resized and make an adjustment in that layer I closed the second layer and after that the image already in front of the object the handphone
  6. Furthermore I used the eraser tool to delete the background and manage it to make it real that’s our logo that attached to some product
  7. Finally , I do the same stage for another product

This is our Advertisement Bundle:

1[mg5a.flixcart.com, 2014]

5[Handingchao.com, 2014]

4[Anon, (2014). Online, 2014]

3[N3.sdlcdn.com, 2014]

2[Static6.shop.indiatimes.com, 2014]

 

5. Event Bunting

Event bunting, before that bunting is a wool manufacture that is used for flag and ribbons (Chilsohm, Hugh, 1911). But nowadays bunting is term for event decoration that is made from paper, plastic or fabric, typically bunting is very colorful and informative (Kerridge,Eric, 1988).  Event bunting is very important to provide us information and introduce the events such as, where it takes place and what time it will be held also the activities, we will put it at the important places to spot more people because of bunting is expensive to print later so we only print a few and make it big like 1.5mx1.0m and we will choose the material which is from fabric that have been proven strong and waterproof, also we put it not only in INTI but at outside too cause we want all the people come not limited the students and workers at INTI.

Because of the event about eye campaign to protect our eyes from diseases so I chose the design about the big eyes to give the visitors awareness about their eyes and gave the big warning to attract people to come to ours campaign with the title “DON’T GET BLINDED BY BAD HABITS” the messages meaning is to make the people to think twice to prevent their from bad habits and to keep their eyes health and this eyes in my opinion is a little bit touching.

10811673_847505625301265_1766113631_n

 

For the tagline world to persuade people I used the word combine with new background that the middle of it like an eye to remind people to protect your eyes as the window of our life and later to put it at the bunting I made in 3D to give some effects also to test their eyes if they can read it from far away or not. The first picture is actually the background for word. Also I used solid color to make the color solid and as the background effect for the “word”, after that I put back the vbackground layer under the word layer so the word will in front of background.

10808273_847505585301269_2067627630_nUntitled

zzz

 

Screenshot_18

 

lol

For the second assignment, we assigned the tasks to every member. Ardy got the task to do the logo and web banner, Rizky got the task to do the bookmark, Arianto got the task to do the advertisement bundle and Felix got the task to do the event bunting. Ardy must do the logo first in order to the other member continue their tasks, especially the advertisement bundle. After the logo had completed then the other tasks are able to work in the same time. The planning is when a member had completed their task, he must do the report about how to do it and upload it to the blackboard therefore he can continue to his animation clip based on the decision that had been made on the proposal. The report will be submitted to the Rizky therefore Rizky can arrange and uploaded to the blog. After all report has been uploaded then we combined all the report and submit it to turnitin to check the percentage of the plagiarism.

The way of designing the logo, web banner, advertisement bundle, event bunting, and bookmark:

Later, I combined all the things and make an event bunting with these element with some information where and when also our activities and just give some effects on the word so it is more eligible and changed the color brightness and curves, also we put our sponsors as a special thanks and support to make the event could happen.

 

Personal Reflection

(Felix Demas – I13004106)

I think about this project was awesome because of with one project only, we can summarize all what we learnt in the past four months including adobe photoshop and adobe flash also we can share our creativity without limitation.

The interaction between group members are all very nice and smooth cause we have known each other before and all of us came from the same country so we don’t have problem with communication.  The most common problem is we need to manage our time, we need to complete all our assignments due to this week and next week a little bit hard but this is what we must do and the duty as a student, the second problem to call all of us to gather for meeting some of us is not have same class and timetable, so we need to adjust the time first therefore we made the facebook group discussion as our platform to communicate and share our progress as Miss suggested and it really works well, so we can suggest each other what is lack of something and can make the revision before submission.

The work completion is a little bit slow in progress cause of we cannot think about the idea quickly and need to reconsider with group members, however we will not waste so many time in vain we made it as good as possible and what we did as we expected. Overall, our group’s performance still under control and our duty is divided fairly also the best part is we can chose what we wanted, so it did not burden us and did what we liked.

I prefer this type of learning because of we are not high school students anymore that must be controlled by the teacher and in high school we must follow what the teacher taught us same in class that we must follow the video and do as the video told but at least we got the basic, in this project we can share our thought and creativity also learn to manage our time and discuss with other people that will be used in real life.

The group’s work create us collaborate with each other to share our information and idea, also it taught us not to be selfish cause we have four group members that must be heard their thought too even the idea is out of topic but we can decide and make the best choice for this group.

 

(Ardy – I13004469)

This project is really tiring. There are many tasks that must be done. Our communication is good and quite intensive at the end of submission. We are trying communicating by face to face or by using social media. The problem that I face is I am not good at drawing therefore I got difficulties to draw a character for the animation and some other part of the animation clip, there is a difficulties to make a movement. The movement that must be used is kinematic movement but I don’t know how to do that. The problem that the group faced is time management it’s difficult to manage the time for each members because they have their own schedule too and sometimes some members need help to give them a guidance to make their task to solve this problem we usually discuss when all members got free time, using the social media or after the class. I rate myself 8 out of 10 and also 8 out of 10 for my team members because we have given all the effort, make the good assignment and complete it within the timeframe. This type of learning is needed more ideas, design skills and practical to improve the design skills. I don’t like this type of learning because I prefer understanding the concept rather than finding the ideas, for example: I liked programming. It’s important to collaborate with others because if some members got problem then the other member can help. Then, this assignment is a group assignment therefore the score is based on group progress cannot be done by individuals.

 

(Arianto Agung Prabowo – I14005124)

This project is really takes a lot of time and need 4-5 hours of my day to do it. Our communication is good and very intense in the second assignment. We try to communicate by means of face-to -face or through social media. Because I lack in drawing it makes me hard to use it there are difficulties in making it a real advertisement bundle. Since I had difficulties when finding a product that goes with the logo and the color I searching the product of the picture that have white or blue background so it makes it more real product  . When I use the magnetic lasso tool is more complicated. And in part of cropping and use eraser tool have to be more carefully and not being so careless if I careless it makes the picture failed and it is not getting in with the picture of the product. I also get difficult with my time -Management is not being affective of a lot of tasks that I have selected easiest way to control. Believe that our team works very hard until the last breath this task quite perfect.

 

 

(Rizky Gunawan – I13004467)

This project takes so many times and tiring that’s need to done. Hopefully, our group communication is good enough with using social media such as Facebook and Line and meet face to face after class. The problem that I faced is need waiting for logo to do my part, there is bookmark and the other problem is not good at drawing for the character and how the movement of the character. The problem in group is time management because everyone has their own schedule so we discuss using social media and face to face for the discussion. I will rate myself 8 from 10 and the other member because we give our time and effort to this assignment when they schedule full with other assignment. From this type of learning, I know more about design skill and idea in design. I prefer the learning like type to go to the application to the problem such as programming or to the software itself than get the idea like that. From this assignment I learn how to design and get more idea about design. The important is how to work together with the other member.

 

Conclusion

There are so many applications that are used to design the image and video. The popular product is the Adobe Package. Adobe Product is used by many designers to do their tasks. We are as students who take the computer program must know the basic how to do or edit the image and video (animation). Editing the image, we have already learnt about the adobe photoshop. We have already known how to make the logo, poster design, and advertisement bundle. We are also using adobe flash to create animation. We had already known about how to make the movement of the character filled with the background music/sound and the button. This is so important to know at least that 2 software, even though we don’t take multimedia course because we also needed it to get idea about how to make an interface of the program and also design is used everywhere and can be used by everyone.

 

 

 

Reference

Ltd, O. (2014). Bunting for all events and occasions | from £3.99. [online]

Flagsandflagpoles.co.uk. Available at: http://www.flagsandflagpoles.co.uk/categories/name/bunting/category_id/bunting [Accessed 15 Nov. 2014].

Photoshopessentials.com, (2014). Placing An Image In Text With Photoshop CS6. [online] Available at: http://www.photoshopessentials.com/photoshop-text/text-effects/image-in-text-photoshop-cs6/ [Accessed 15 Nov. 2014].

Images

Anon, (2014). [image] Available at: http://live-wallpaper.net/ipad/img/app/a/z/azure-eyeazure-eye-abstract-hd-wallpaper-2048x2048_7d4e35d096eab7b07368ab9891ada535_s.jpg [Accessed 15 Nov. 2014].

Anon, (2014). [image] Available at: http://live-wallpaper.net/ipad/img/app/a/z/azure-eyeazure-eye-abstract-hd-wallpaper-2048x2048_7d4e35d096eab7b07368ab9891ada535_s.jpg [Accessed 15 Nov. 2014].

Anon, (2014). [image] Available at: http://live-wallpaper.net/ipad/img/app/a/z/azure-eyeazure-eye-abstract-hd-wallpaper-2048x2048_7d4e35d096eab7b07368ab9891ada535_s.jpg [Accessed 15 Nov. 2014].

Anon, (2014). [image] Available at: http://imageshotfrogmy.blob.core.windows.net/companies/ISEC-International-Specialist-Eye-Centre/images/ISEC-International-Specialist-Eye-Centre_8946_image.jpg [Accessed 15 Nov. 2014].

Anon, (2014). [image] Available at: https://pitchenginelive.blob.core.windows.net/dev/51ebfc3e-eb04-4bd2-89d6-45d911d74543/c0ef3efd-2a2a-47bc-83c6-e29c0566e460.jpg [Accessed 15 Nov. 2014].

Smileycat.com, (2014). Banner Ads Design Gallery | Elements of Design. [online] Available at: http://www.smileycat.com/design_elements/banner_ads/ [Accessed 13 Nov. 2014].

Static6.shop.indiatimes.com, (2014). [online] Available at: http://static6.shop.indiatimes.com/images/products/additional/original/B1067204_View_1/computers/portable-hard-disk/hp-500-gb-usb-3-0-portable-hard-drive-black-.jpg [Accessed 18 Nov. 2014].

 

Anon, (2014). [online] Available at: 1. http://static.acer.com/up/Resource/Acer/Accessories/External%20Drives/Images/20110512/Hard_Disk_Drive_3.0_350x250.jpg [Accessed 18 Nov. 2014].\

Handingchao.com, (2014). [online] Available at: http://www.handingchao.com/wp-content/uploads/2009/11/ASUS-K50IJ-X8.jpg [Accessed 18 Nov. 2014].

Google.co.id, (2014). hard disk black – Penelusuran Google. [online] Available at: https://www.google.co.id/search?q=hard+disk+black&espv=2&biw=1280&bih=615&source=lnms&tbm=isch&sa=X&ei=klVpVKrzEsicuQTKjILoBg&ved=0CAYQ_AUoAQ#facrc=_&imgdii=_&imgrc=TyuqGRAPUmGmXM%253A%3BQtjUXt5TjgjH3M%3Bhttp%253A%252F%252Fn3.sdlcdn.com%252Fimgs%252Fa%252Fi%252Ft%252FSony-1-TB-External-Hard-SDL754466055-1- [Accessed 18 Nov. 2014].

mg5a.flixcart.com, (2014). [online] Available at: http://img5a.flixcart.com/image/external-hard-drive/x/h/g/seagate-backup-plus-slim-400×400-imadsx5h9zathyrb.jpeg [Accessed 18 Nov. 2014].

 

Leave a Reply