Final presentation

We finally finished our magazine for ROTTW. The presentation was great, Abang Rom actually liked our idea of introducing a new section for the magazine 'behind the scenes'. Though he also commented that we should work on the design more as the flow of the magazine was not there. This was also due to our magazine cover to be more rock but the content of the behind the scenes were rather clean and too neat.

I think the strength of our group is that we were able to cooperate very well with one another. Everyone was able to finish up their part of the assignment given. We would also always help each other and give opinions to help improve the content and interactivity for our magazine. As for the weakness of our group, I would say we lack some technical skills, as we were not able to fully execute and make the sound mixer function fully, there were some errors and buttons were unworkable. Because of this subject, we were given the opportunity to work with ROTTW magazine which was a very good experience as we get to have face to face feedback to help improve in terms of our skills and design. Working with clients can be very stressful but at the end of the day, but all these hard work is worth it as we get to learn many things and information such as how we should be in the shoes of our target audience in order to sell our idea or product. Threats of working on the project is that the software use have many problems and bugs. Tutorials and forum were very hard to find as edge animate is still a rather new adobe software in the world.

Overall the experience was excellent, I hope we are able to be given chances on working on projects with the people outside of the campus, to get out of our comfort zone. 

Sound Mixer, HEADACHE

I have been working on the sound mixer for the past couple of days, cause we have to compile everything into Indesign and make sure it works by Friday. I have gone through numerous tutorials to try and fix the problem I have been having such as the mute buttons not working, to add some animations when the buttons are pressed, the volume control as well.

Finally today after working on the sound mixer for the more than 12 hours, I could finally make the sound mixer work. As seen in figure 1.1, the codes are longer cause I have to create a folder with the working file, and set variable to bring in the audio. This was working fine, till the part where I wanted to toggle the mute button, though I have set a variable for the mute and its action, it was still unable to work.

figure 1.1

Then I thought of another way, to just directly import all the audio into adobe edge animate, from there I just have to select the action for each buttons which made the codes much more easier and shorter as seen in figure 1.2. I thought at first that everything worked perfectly, till I tried viewing it in the browser, some of the buttons don't appear, but the buttons is just there, and I was still able to click it, figure 1.3. Unfortunately I can't see whether there is animation happening on the buttons or not. 

figure 1.2

figure 1.3

Week 12 - Importing html into Indesign, content page interaction

Today in class we continued on working on the features for the magazine. I tried putting the content page into Indesign, first I had to separate all the pictures, the buttons, and create a background to be placed in the content page. Tricky part is when I have to adjust the picture size base and then putting them into Indesign. I created buttons for the content page, so that readers would be able to navigate from this page to their desire page, after working on the buttons and putting the effects on them, it turns out that the button interaction would work in a swf and pdf file. When view in a adobe content viewer, the function would not work, so I had to redo the entire button and try to make them work using hyperlink and object states.

Another things I tried out today in Indesign was putting the sound mixer in, which did not work though it is a html file. Another problem the group is having is that, since the sound mixer is a html file only controlling the audio, we still have not figure a way to make the play better work together with the video file which would be placed on top of the mixer. Other than that, the mixer works find, the buttons are drag-able, buttons work but only for the stop button. The group decided to add mute and un-mute buttons for the instrument of the multi-track to give the sound mixer more interaction.

Week 11 - Instrument set up and recording

Today our group was finally able to get to use the music room, Spencer managed to ask one of the music club members to borrow us the room for recording. All the instruments were available such as the guitar, keyboard and drums, which solve our problem of bringing our own instrument to record. Upon arriving at the room, we had to set up all the instruments and wait for our actors and musicians to come for the recording. During the recording, some parts of the video were really dark, we borrowed a direct lighting machine from Mr.Martin but did not use it in the recording as the lights were too bright, it did not felt like a studio like environment. So we decided to use all different kinds of angle to record the musician and actors as they play the instrument, we managed to take quite a number of videos. Now all its left is to compile them and choose the ones we want, edit, render into a video and place it into Indesign.

One of the shots from the recording today. More updates to come soon

Week 10 - Friday

Since the group did not have much time to fix on the sound mixer today, we decide to try and finish up the cover page for the magazine. Nathania did a mock up design for the cover, we then made changes, everyone giving suggestion on what to change. We tried out different fonts for the band's name on the cover page, the colors of and sizes of the font. One problem we faced today was that the picture that we decided to use for the cover, the bottom right corner has different light exposure, this gave the group a little headache as the fonts could not match the background. We tried different color and sizes for the font but still felt that the words could not been seen properly. Finally I decided that we should just photoshop that certain part of the picture, by decreasing the light exposure, but at the same time matching the color of the wall. It the end the result came out pretty satisfying.

After finishing that part, we somehow felt that the cover page was somewhat still missing something. We referred back to our previous cover page mock up, and notice that we included a saying that is quote from the singer or band, after adding in somewhat a quote into the cover, it look almost complete. Next is to finish up the recording of the studio, instrument set up, and the interview for the singer.

Sound Mixer for behind the scenes

Today our group continued with the prototype for the sound mixer. Many problems occur such as getting the volume tuner to work on a scrolling animation, which we could not figure out how, so the group decided to go with simple buttons that has the volume up and down function. Another problem we had to discuss is that whether we could do the sound mixer in Adobe flash, before trying out, we got some fla files from our previous semester and tried to import the file to Indesign but it did not worked out. Then we proceed to finding ways to convert the fla file into html, Mr.Razif suggested a software call swiff, which was able to convert the file to html, but was unable to read the animation, so the group decided to just stick with Adobe Edge Animate. 

This was a prototype I did for the sound mixer. The 'play' and 'pause' button worked perfectly, together with the volume control buttons, only downfall is that it does not control the animation for the volume as seen on the right side of the stage. Mr.Razif suggested that we just use the scrolling and design on the mixer which would be able to be scroll, but does not affect anything.

As for the sound wave on top of the sound mixer. We decided to import the multi track into audition or pro tools and play the tracks, replacing it with equipment and instrument at the side. With the tracks playing, we would use a screen capture video and then placing this video into Indesign, when click on the play button on the sound mixer, the video on top will play, and it would look like as if the music is playing with the sound wave appearing.

Week 9 - Studio Recording, equipment set up

Today our group finally found time to do the studio recording for behind the scenes page. We had to set up some of the studio equipment and we shot footage of  how the studio is set up. We recorded the studio with the panorama view that we have planned, only thing is to decide later on whether we will use images taken, or changing the video we took into image sequence. Both procedures ended up with different environment lighting as the pictures taken were slightly darker due to the ISO being lowered, and the video being slightly brighter. We would later on discuss on which to use for our behind the scenes. As for the recording of the instrument set up and interview of the band's singer, we had decided to record them another day as we are still waiting for the reply of them. More to come soon!

One of the pictures for our panorama 360 view

Week 9 - Monday

Today we have to discuss on several issues on how to execute our features for behind the scenes. We still are having problems to create button for the sound mixing page. Buttons such as increase volume and decreasing volume is still unsolved but for the 'play' 'stop' and 'mute' buttons, they have been solved. Another issue is the sound wave we for our sound mixing page where the sound wave for the different instruments will appear as the song plays. I came out with an idea to place the multi-tracks, import them into adobe audition, do a screen shot video from there, and bringing it to after effects and mask the sound wave from left to right so it will look like there is sound wave when the song is playing.  

Since we would be conducting an interview to be put into our pre-production, we would need to prepare some cameras to do video recording also to include together with some text and description for the page. Hopefully the singer for Kluk Kluk Adventure would be available this coming Thursday for the interview.

week 8 - Monday

Today our group had to decide on how to do the some of the features in terms of technically for behind the scenes. We went through some googling and found a tutorial that has the play and stop button for Adobe Edge. So me, Adriana, and Nathania got together to try out the tutorial, while Spencer did some research on how to do the drag able button for the sound volume.

Half of the time in class, we were scratching our head on how to solve the problem as the tutorial did not clearly state a step by step on to how to do the buttons. We went back and forth and checking to whether every code is written correctly but still could not found the problem. Then Adriana proceeded to look for more tutorials on how to make the similar feature, she then later found a video tutorial, which our group have not work on. Spencer on the other hand had found so far that the only way to work on the volume control button is to work on Adobe Flash which we would need to convert to swf file and then later transfer to InDesign.

We also did a short consultation with Mr.Razif on our question for the interview. Our questions are much more better compared to the previous one, it has better flow and more questions regarding about the band. We just had to reduce the amount of questions as we have to consider that the answers would be long also. Another thing we found out today that we could also choose to do between sound page and behind the scenes for our group, our group then decided to go with behind the scenes. ( what a big relief )

The following below would be question asked during the interview, question would change or not asked based on answer given during the interview :

INTRODUCTION
1. Could you tell us a little bit about Kluk Kluk Adventure – the band’s background ? [ how, when, why ]
2. Who are your major influences ?
3. What is your role in the band? How about the other band members? Have you had any changes of member or roles ? If yes, has it affect band’s music style from the beginning till now ?
4. What has been your biggest challenge as a band ? Have you been able to overcome that challenge ? If so, how ?

PRODUCTION
5. What is the message that the band is trying to potray or tell through the song?
6. Who writes the song lyric for the band ?
7. How about the music-making process?
8. What was the most challenging part when producing the album/song?
9. What are your rehearsals generally like? Do you have a set time each week in which you practice or are rehearsals more spontaneous?
How can fans get access to your music? Do you have a website with sample songs or a demo CD?
10. Do the band have any upcoming gigs or events?
11. What advice do you have for people who want to form their own bands?
12.Is there anyone you'd like to acknowledge or feel thank you to?

Week 7 - Deciding which band to use for our content

On Friday's class, we were given a short tutorial on Indesign and how to make some function work, we could code our designs and magazine in either Dreamweaver, Edge to make into a html file and then bring it into Indesign. As from now on, each group would need to experiment the functions and features they want to apply for them magazine and test whether the functions and features would be able to be put into Indesign.

As for our group, we got together to discuss some local bands that we would want to feature in the different section of our magazine. We would be featuring more on a local band call Kluk Kluk Adventure as we sort of have more direct contact with the band because Mr.Razif is the band's keyboardist.  We would be using the bands picture for our cover page, behind the scenes, and one tutorial song from the band, the other being Laila's Lounge, also another local band.

Kluk Kluk Adventure

Laila's Lounge

Another than deciding the band, we had to decide the questions we would ask in the interview section for our behind the scenes page. We came out with a number of questions and consulted Mr.Razif about it. He suggested that we should focus questions more on asking about the band and the band's music also change the flow of questions. After more discussion with the group members, we refined our questions and arrange them more better. The questions are as the following :

INTRODUCTION

1. Could you tell us a little bit about Kluk Kluk Adventure – the band’s background ? [ how, when, why ]
2. Does the band have a record label ?
3. How long have you all known each other?
4. What genre of music do you consider your work to be ?
5. Who are your major influences ?
6. Do they influence the band’s music style ?
7.  What is your role in the band? How about the other band members? Have you had any changes of member or roles ? If yes, has it affect band’s music style from the beginning till now ?
8. What has been your biggest challenge as a band ? Have you been able to overcome that challenge ? If so, how ?
9. What is your ultimate direction for your band ?

PRODUCTION

1. What is the message that the band is trying to potray or tell through the song?
2. Who writes the song lyric for the band ?
3. How about the music-making process?
4. What was the most challenging part when producing the album/song?
5. What are your rehearsals generally like? Do you have a set time each week in which you practice or are rehearsals more spontaneous?
6. How can fans get access to your music? Do you have a website with sample songs or a demo CD?
7. Do the band have any upcoming gigs or events?
8. What advice do you have for people who want to form their own bands?
9. Is there anyone you'd like to acknowledge or feel thank you to?

Week 6 - Strength and Weakness of group members

Group members :

- Spencer

- Adriana

- Nathania 

Spencer's only weakness probably is that he sometimes lacks the initiative to do group's work, but if tasks are given to him, he is more than willing to do it. Design layout for mock up aside, Spencer strength is that he is able to design the magazine to be more interactive and look in the point of the reader's view. 

Adriana's weakness is that she lacks leadership. Adriana says that she lacks design sense, which is understandable because we are in multimedia, but Adriana could still try to put in more effort to design the mock up pages. Her strengths are that she is punctual in every meeting we set.

So far I have not seen or figured any weakness that Nathania has within the group. Her strength is that she is able to complete a heavy task given to her and shows a lot of effort in terms of design, and technical mock up. Nathiana is also very critical in a positive way as she would voice out on her opinion when something could be done better. Which our animation for cover page was done by her. 

Overall all my group members are very corporative, and willing to help each other. I can say we are one of the groups that are more flexible and have better teamwork. Everyone is very responsible, when task are given, everyone would complete them. As for weakness in overall, I would say that we lack a proper true leader that could or would lead the entire group. 

Week 6 - Design Proposal

Today we did our design proposal for ROTTW magazine. We have finalised on the designs for our cover page, content page, tutorial page and also behind the scenes page.

Design and navigation for content page.

A design updated page for tutorial sound page.

Behind the scenes page where there will be a panorama of the studio, where readers can view a 360 degree of the studio and zooming in and out also. Readers will be able to click on the instruments and equipments to view the information. By clicking the arrow bottom, readers will be directed to a page where there will be 3 section including pre-production, production and post-production.

 In pre-production, readers will be able to view an exclusive interview of the band and producer on the left hand side, while on the right hand side, readers are able to scroll up and down of the article. 

Production page is a video on the top where readers can scroll the video frame by frame on the recording session of the album or song. It consists of the set-up of instrument and equipments. And as for the bottom half is an article of the production process which readers can scroll also.

As for post-production page, readers can have more interactive in this page. A sound mixer analog will be provided where readers can have a bit of experience on how to mix sounds. The analog provides turn and off buttons for the different instruments and microphone. Readers are also able to start, pause and stop the song.

Week 5 - Friday

Today our group sat down again to decide the features to put for our 'behind the scenes' page. Progress has been really slow as everyone has assignments in their hands and this page has cause headache for the group, though we did brainstorming, but could not really come up with good ideas for it. So far we decided to have an interview in the pre-production and sound mixing for the post-production. As for the production stage, we are still lacking of ideas. By the weekend, we would be meeting up to finish up our design for all 4 pages and do a little animation for the cover page. 

Our group has been looking for ideas and tutorials on how to execute the different functions in our pages. Below is a picture and link found by Spencer on how to do a panorama image as it is one of our ideas of a panorama studio view for our 'behind the scenes' page.

http://tv.adobe.com/watch/learn-indesign-cs5/creating-a-panorama/

Our updated design for cover page based on Nathania's design.

Next Monday, the client would be coming for our 2nd presentation, hopefully our group would be able to produce something that will satisfy the client and good luck to all the other groups.

Week 5 - Monday

Today, we had a short presentation again. Every group had to finalize the design or art direction they are heading and the features they want to input into the magazine. My group presented to the class about our designs for the cover page, content page, tutorial sound page and our behind the scenes page. Not much changes after discussion with Mr.Razif since last Friday as our group had not sat down and did a proper discussion during the weekends. 

And some updates of our soundpage.

We however decided today, that we will research into more of our post-production section in our behind the scenes. The idea is to record a video of different people playing instrument and singing at the same time where readers are able to mute and play by tapping on the person. Our group will be meeting somewhere in this week to finalize our design and features to be put in our behind the scenes page. 

More updates to come!

Week 4 - Friday

Today we had to decide what will be the features for our pages for ROTTW magazine. So everyone got into their groups and started their discussion. As for our group, we did a little discussion of how our tutorial page and behind the scenes would be, and what would it contain. After discussing with Mr.Razif, our group does not have enough interaction in it, and we would need to think of more ideas to put into our pages to make it more interactive. For behind the scenes, we have to research on what are the things that happen behind the scenes for every procedure and process of it, we have to find out what happens in pre-production, production and post production. Mr.Razif suggested that we could do a sound mixer for the post production session, readers to able to choose the sound or instrument they want to hear from the songs. Our group will be doing brainstorming and mind mapping during the week to come out with more ideas on what to do for our magazine. After coming out with ideas, we need to find tutorials that will help us execute the idea. More research needs to be done.

Week 4 - Monday

Today Mr.Razif isn't feeling very well so the class was cancel. But my group mates and I decided to go on with our discussion to finalize our design mock up for ROTTW. After much discussion, we all came to agree that we would want to make our magazine more interactive. So we decided to use Nathiana's cover page design, but applying animation to it that readers will be able to see section and words moving in when they read the page. 

Reference for cover page : http://licklibrary.ceros.com/iguitarmag/stevie-ray-vaughan-guitar-interactive-magazine/issue20/page/1

As for the content page, we would go on with my design. From this content page, readers are able to navigate straight to a particular section in the magazine. And as for the other section that is available in the magazine, would be position at the right hand since of the page, where readers are able to click on the section the want to read, and a sub-section would appear allowing the readers to navigate to the different sections of the magazine.

For the section that we will be improving on is the tutorial/ soundpage. Spencer's design gives readers more interactive, from choosing a song they want to listen and learn, a sub button will come out which readers are to choose the instrument they want to learn, and would be navigated to another page, where the overall tutorial is.

The section would be introducing is a 'behind the scenes' page. Where readers are able to read and see how is an album produced. This page includes a parallax scrolling video at the very top, then divided into 3 columns which include, sound mixing, interview and recording of the album song. All this column includes short synopsis of the particular section where readers are able to scroll up and down to read while a video on the left hand side plays. Readers are able to double tap the video to enlarge it and double tap to minimize the video, the video can be played even while the reader is reading the text.

Week 3 - Friday (Comments & Feedbacks on group leader, Adriana)

Today in tutorial class, every group has to finalize or at least decide what to do for the page to improve and introduce for ROTTW magazine. Our group had a very hard time deciding what to do for our tutorial page and behind the scene page. After much discussion, we decide to use a similar concept as below :

We also need to include a part for readers to be able to listen to the rhythm of the song so that they can know the beat and tempo of the song.

For behind the scenes, after discussing with Mr.Razif. He suggested that we still need to put in some text in the content and not only with just a video. If we were to do the behind the scenes, Mr Razif suggested that we should do a simple studio tour, the things that will have in a recording studio. Divide the behind scenes into different section so that readers can choose which to read and watch the video, section would include sound mixing, interview, recording etc. For each video in this section, we would include parallax scrolling so that readers would be able to scroll through the video with their fingers or by using the mouse.

We would need to finalize our idea on what to do for each of the pages we would be doing. Through out the past few weeks, our group has been doing on researching on how to improve our contents for the magazine. Adriana as leader, has  arranging the different content we should include and everyone must come out with their own design for the cover page, content page, tutorial page and the behind the scene page. We would be switching leaders from now on so that everyone has a fair share of responsibility. 

Adriana is very flexible, corporative and punctual. For every group meeting we had, she will always be the first one there. In my opinion, there is still a lack of effort when it comes to designing mock up, there is still space for her to improve on the mock up. As in terms of leadership, she is does not boss us around, gives everyone chances to do whatever each group member wants, but she could learn to be more critical towards other group member's work as positive critics are good for self and the groups improvement.

Week 3 - Monday

Today we had our first client presentation from ROTTW, Abang Rom. He gave us a lot of information about ROTTW, what kind of magazine it was, who are the target audience and many more in depths of the magazine. He also share about the concert and jobs he has done so far, from what we see especially for concert, I know today that it really requires a lot of behind the scenes work to make a concert successful.

After the Q & A session, we proceeded with our presentation for the e-magazine proposal for ROTTW. My group idea was to improve the lyrics page by having tutorials on 2 songs. Readers will be able to choose which 3 instrument they want to learn from.

My group also decided to introduce a page where readers to see a video of behind the scenes of how an album is produce and have short interviews of the producer, band or artist. As the usual magazine mostly consist of review of song or magazine only. Abang Rom gave us a few feedback and for our group, he expects us to do the 3 instrument tutorial. Hopefully it will be done successfully without any problems.

Week 2 - Friday

Today Mr.Razif showed us a video of what is 'scamper' and how it is to be done. Normally use when we have a project or product in hand, and we try to find out its pros and cons and what we can turn it into another form. Another interesting video was how to generate great ideas. 

After all the video watching, we are to come out with 4 questions related to our e-magazine. Questions that we would ask viewers in what they want to see in e-magazine. Question are to be more specific and not board so that we can get ideas of how to make our e-magazine better for the viewers. Our group had a hard time coming out with questions but thanks to Mr.Razif, we were able to come out with the 4 question but we would need to improve them later on. We would be presenting our idea to the client in the coming Monday. Good luck to all the groups!

Week 2 - draft proposal

Today in class, we did a simple proposal for one of our assignment, by making a local magazine ROTTW into a digital magazine. Our goal is to remake a section of the magazine and introduce a new idea or concept that the magazine does not have.

What my group decided to remake, was the soundpage section, which on the page, teaches readers on how to play a particular song of a band. It has it's lyrics and guitar chords of the song. What it is lacking is visual design of the page, and something readers can interact with. Many people may want to learn the song but aren't able to because they don't know how some chords are played. Therefore, our group proposed to have a video tutorial that teacher the readers not only the guitar part of the song, but also the bass guitar and the drum. With this, readers are able to choose their preferable  instrument.

Next is to introduce a new idea or concept for the magazine. Our group proposed to have a behind  the scenes on how the album or song was produce, or if there is a music video of the song, then a behind the scenes of it. Maybe a short interview of the producer about how the song come about and how the song is produce. The magazine consists of most album or song reviews so our group and Mr.Razif agreed that this would be a good idea to get the readers to read a section of this magazine.

More updates to come.

Week 1, Exercise 2

Question : How to get attention of readers to read a particular section?

Idea 1 : Include an interview of a popular singer or band that is popular and is liked by many. This is a good idea to get reader's attention as they can get an exclusive interview of their favorite artist or band in depth. It can get the readers to continue reading on as they would want to know and understand many details of their idol like, how they grew up, how and where they get their inspirations from, how and what make them come together as a band.

Idea 2 : A section on how to play a particular instrument like the guitar. This section can include chords of a song that teaches the reader on how to play the song, it also can include a short video on how to strum certain chords on the guitar. A sound recognition is a good idea, like a sound detector, when a certain chord is played, the detector can tell that whether the chord is played correctly or not.

Idea 3 : A title that catches the attention of the reader, or in a digital form example, 'click title to read more'. An example of a title, 'Stand a chance to win a free album'. By clicking into the title, there is a small survey or competition on winning a free album of a band, it contains question like how much the readers knows the band, why do they deserve winning. Also throwing in a chance to meet the band face to face, could get the reader to participate with enthusiasm. 

Week 1, Exercise 1

Thanks to a course multimedia I have came to learn that some things, you don't get to learn from books. One has to explore the different kinds of ways to express something, whether it is an advertisement, information, a short video or film. Through many assignments and task given in college and university, I was given a chance on how to express my creativity by executing these task. From the very start of pursuing my diploma, I was a student that was very fresh to multimedia, my creativity level was very limited, my first assignment was to design a poster that combines the different races in Malaysia, I did not knew what I was really doing then, my design was distorted, the colors I used for the design was horrible. As time goes by, I learned that research and observing other design are very important as they give inspiration and ideas. 

As for creative style, my older design and works are very dull and the colors are usually darker colors. Font wise, I used to use very fancy design fonts and I find them very cool, but only to realize that they aren't good designs. As I learn and observe other people's design through my diploma, I have learn that designing is very subjective, some people may or may not agree that a design is good and excellent , but we can agree that some designs can be really bad, as in REALLY BAD. Example of one really bad design, figure 1.1, is a poster I did during my early semester in my diploma course.

Figure 1.1

After a couple of semesters, I learn to design better, using simple yet unique fonts. Limit the amount of colors used, neat and tidy content.  Figure 1.2 is a web design for an assignment. 

Figure 1.2

My motive while designing or executing a certain task, I want the viewers to understand what I am trying to portray. I want the content to be understandable yet not too straight forward at the same time. I try to approach more on ways how can I design my content in way that can interact with the user so that it has more impact and the user can always remember what are the content. 

I through multimedia I got many opportunity to express my creativity, whether it is designing an advertisement for poster, a short video, or creating an application for a smart phone. I got to be exposed to many kinds of ways on how to execute a certain task. Coding especially, whether for a website, mobile app or game design, I have learned that those fancy stuff you see on the television or internet do not just pop out like that, it has to go through many stages of planning, research, developing and finally coming out with the final output. Through game design, I learned to explore different ways on how my game design would be played and designed.