Reference for DIY categories
Reference for Magazine cover design
Day 4 to 5, we have finalise our title of magazine which is called DIY and the category that we chosen is home decoration. The reason why we choose home decoration category is because it's suitable for unisex. While for the article of our magazine we choose these 3 :
- Interview session with expert in crafting or handmade.
- Tutorial
- Craft supply
_________________________________________________________________________
Week 2
On 5th September, we have another discussion on our cover design and we start breaking down our content element for each of our articles. At first, we was discuss about cover design. And when it come to DIY, the first thought that come to my mind was a pair of scissors. So we decide to come up with all the craft materials which arrange nicely. So, in order to make the cover of our DIY magazine into much more interesting, we planned to use the stop motion technique in the craft material that listed in our cover magazine. The reason that we choose stop motion technique is because it was suitable in the category of art and craft.
Sketches for our cover design and detail break down for our articles
Next, we also try to finalise and break down our content of our articles. Although we had finalise the 3 articles, but then Mr razif had give us some advice on having another extra 1 or 2 articles as our back up plan if any one of them doesn't work well. Here are the list that we have finalise for our articles:-
- Interview Session
- Tutorial
- Editor's Pick(Buying Guideline)
- Craft Supply
- Printing Service
- Event
In addition, we also discuss on what are the typography that should be apply in our DIY e-magazine. So each of us was decide to research on which typography should use and then we share the information in google drive with each other.
So, based on my research for typography, I plan to have 2 type of typography in our magazine, which is serif and san serif type of typography. For serif type of typography, I would like to apply it as our title of magazine in our cover page design while for the content of the magazine, I would like to have san serif type pf typeface. The reason that I chosen serif type of typeface is because it is a functional choice and it draw the reader attention based on the stroke at the end point of the typeface. Beside that, it always convey a sense of traditionalism and classical style appealing. However, for the san serif typeface, the reason that I chose it was because it does ease the reader to read and it won't give so much pressure compare to serif typeface.
The typeface that I had chosen for our DIY magazine:-
Serif Typeface : Effloresce
Apply at : Title of our magazine
Effloresce - Typeface for the title of our magazine
Serif Typeface : Sexsmith
Apply at : Title of our magazine
Sexsmith - Typeface for the title of our magazine
San serif Typeface : Avenir
Apply at : Content of our magazine
Avenir - Typeface for the content of our magazine
San serif Typeface : Roboto
Apply at : Content of our magazine
Roboto - Typeface for the content of our magazine
Beside the typeface that I had did for the research, Ching Lin, Sam and Kyeong Ju also did some of the typeface. Here are a series of font they did for the research for the typeface. So that we can use max 3 type of typeface in our DIY magazine.
Adamas Regular
Amatic SC regular
Archistico Bold
Cabin Sketch
Helvetica
LittleLord
Metropolis
Rasanskool
Rotulona
Sketch Block
After a series of different typeface we had decide to have Metropolis and Effloresce. The reason to have 2 different type of typeface is because we haven't finalise the color palette. So once we were done with the prototype, we will try to apply this 2 and see which one of them give them best outcome for our cover page of our book. Moreover, the content of our e-magazine, we decide to have the family of Helvetica and Avenir font family.
Breakdown content of our Articles
Interview Session
Based on what we have discuss earlier for this part of interview session, we were plan to featuring some expert in craft by have some interview session with him or her. So, I had found 1 expert who was master in clay. His name is Khing Chan and he is from Penang.
Tutorial
Tutorial will be provided in our magazine. We had plan to provide maximum 3 different type of home decoration tutorial with video and picture provided to the reader.
Editor's Pick(Buying Guideline)
The editor's pick will be basically some recommendation from the editors of the craft material. For example, where to get the cheapest craft materials, best quality of craft materials, famous brand of craft tools, pricing and others. These articles will basically cover the material for entire of DIY category. Due to it's basically are discuss about the material, so to avoid any confusion, we will highlight that this material are suite in which category of DIY.
Craft Supply
This articles probably will provide a series of place to get all the material from the nearest craft supply with the address. For example : MR DIY, Popular, Kinokuniya and others.
Printing Service
This session will list down the shop which provide printing and binding service like what are the type of printing service that had provided from the shop. This will come along with the address and the contact from each of the particular printing service shop. Beside that, we will list down what kind of printing service they have provided from their shop.
Event
For the Event, in our list of articles, it was basically list down the upcoming event that hosting for a DIY competition(any category), exhibition, wholesales crafting material and others will be show up in this category of the articles.
Link provided : http://www.instructables.com/contest/
Competition
Referencing
21 Stunning Serif Fonts for the Modern Website. 2016. 21 Stunning Serif Fonts for the Modern Website. [ONLINE] Available at: http://www.dtelepathy.com/blog/design/21-stunning-serif-fonts-websites. [Accessed 11 September 2016].
Week 3
On 14th September, we get to have a consultation with Mr Razif. Ching Lin, KyeongJu and me show our layout design to Mr Razif. The reason that we show him our layout design is because we want to get some professional review from e-magazine. Here are the sketches of layout design from me, Ching lin and Kyeong ju.
Sketches from Kyeong Ju
Sketches from Ching Lin
Sketches from me
After showing our sketches of our layout design to Mr Razif, he had comment on my sketches. He give us an idea of by listing down our articles of editor pick in tutorial section. The reason is to help the reader have a nice flow on reading it. So, once the reader finish the DIY tutorial, if they were interest on the products, they can scroll down and have a look on where to get the material from Buying guideline section. Beside that, we also decide to use my sketches of layout design for our e-magazine.
Furthermore, we also propose an idea of stop-motion feature for our cover design to Mr Razif. The Image below show the cover design of our e-magazine with the feature of stop-motion feature. In our cover design, we plan to use an idea of an empty glass with star. This idea was actually come up from Phang Rong jin. So the basic flow of our stop-motion will be start with an empty glass without any text at background, then the next motion of it will be a star fill up the empty glass until it full, then the glass jar will shown the movement of shake with some simple text such as "Touch me", so that the reader are able to have an interaction with our e-magazine. After the reader touch the screen, the jar will explode with full of star. At the same time, the title of our magazine and the text will be appear as our background.
Cover design Idea
In addition, Mr Razif also suggest us to change our original title of our magazine which is DIY. He comment that our title of our magazine are too common, so he was asking us to come up something new and creative to our magazine so that it would give the reader have a new fresh look of DIY magazine. After receiving the comment from Mr Razif for our title name of our magazine, we have another discussion by distributing few task among the group. So, Sam and Kyeong Ju were figuring about the title of our cover magazine; while me and Ching Lin were deciding which tutorial we should apply it in our magazine.
Sam and Kyeongju propose few name for our title of our magazine. The listing below show that the naming of out title magazine from Sam and Kyeongju:-
Sam:
1. Meringue
2. Pavlova
Reason:
"It give a delightful, tranquility and harmony feel."
"we want the reader to feel fresh, pleasant and uplifting when reading a diy magazine, same like seeing and eating a dessert"
KyeongJu:
1. Atelier
2. My worktable
Reason:
"It give a feeling that the magazine can be the work space of people"
After the discussion, we decide to use "Atelier" as our title of our e-magazine. Next, we also confirm our articles after the consultation with Mr razif. And in a mean time, we had plan to have 4 articles which is
- Interview session
- Tutorial + Buying Guideline
- Craft Supply (Place of interest)
- Event.
(The breakdown articles can refer to Week 2.)
On the other side, Me and Ching Lin have pick 3 products that we gonna to DIY it ourselves in tutorial section. The image below show that those 3 DIY products that we selected in home decoration category.
Wall decoration made from Toilet paper Rolls
Home decoration made from balloon and yarn
Vase decoration made from a steel can and rope
Once we finalise our 3 products that we gonna to DIY it ourselves, Ching Lin and me start to go get the ingredients from IPC. We brought a yarn and a rope. Moreover, we also collect lot the empty tissue rolls, cans and glasses during this week.
Can
Glass
Empty tissue Rolls
Furthermore, I personally did a timeline planning and task for each member in our group. The reason for having a timeline and task planning is that each of us can keep tracking on our work in weeks and we can do our part separately in future. The image below show the timeline planning with a gantt chart and task activity will be shown in a table form.
Timeline planning in Gantt Chart
Task activity
Week 4
This week we have to present our proposal to Mr Razif. So, we have prepare all the slide in Google drive and the content of our slide will be include of the magazine title, reason of why we use Atelier as our magazine title, table content, breaking down our articles, cover design, layout design, editorial board, back cover design splash screen and what kind of effect or effect that will be implement in our Atelier e-magazine.
Here is the link for our presentation slide:
After we have done our presentation, we do receive few comment from Mr Razif which he ask us to come out a
- New title name for out Tutorial and guideline.
- Have some change for our editorial board.
- Come out with a back cover layout design.
Once we received the comment, we start to have a discussion for come out a name for replacing our "Tutorial & Buying guideline". So we had come out "Your atelier" as our title for our articles of "Tutorial & Buying guideline", while for the subtitle itself, we use back the same name in our article which is "Tutorial and Buying guideline ".
Beside that, we also updated our layout design into wirefrhame. Kyeong Ju, doing the wireframe for our Atelier magazine while me and Ching Lin were preparing for the content of the slide. The image below will be show the wireframe of our Atelier magazine.
Wireframe of Table Content
Wireframe of interview slash screen
Wireframe of interview-feauturing interviewee
Wireframe of interview - Question
Wireframe of interview - product create by the interviewee
Wireframe of Event splash screen
Wireframe of Event - Sales
Wireframe for event
Wireframe for tutorial splash screen
Wireframe for tutorial - instruction + buying guideline with hover effect
when user click on the product
Wireframe for Craft Supplies splash screen
Wireframe for craft supply
Wireframe for craft supply
Wireframe of Editorial Board
Wireframe of our Back Cover Design
References
Pinterest. 2016. 25 DIY Gifts You Can Make in Under an Hour | Easy Diy Crafts, DIY gifts and DIY and home improvement. [ONLINE] Available at: https://www.pinterest.com/pin/503488433322369430/. [Accessed 16 September 2016].
Pinterest. 2016. Don’t Throw Out Those Paper Towel and Toilet Paper Rolls! Here Are 17 Brilliant Ways to Reuse Them! | Paper Towels and Toilet Paper Rolls. [ONLINE] Available at: https://www.pinterest.com/pin/420734790171122093/. [Accessed 16 September 2016].
Week 5
In this week, we have a video shooting for our 3 tutorial and cover design which is on 29th September. So before the shooting day, Me and Ching Lin start to do the prototype of our tutorial which is tissue roll, yarn ball and vase. The reason that we start to do with the prototype first is to save our time on shooting, so that we can replace the finishing prototype to the final product that we use to film or shot on that day itself.
Prototype for DIY empty Tissue roll
Material need: Empty tissue rolls, Ruler, Blade, White Glue, Paper Clip, White Spray
Prototype for DIY Yarn ball
Material need: Balloon, Yarn, White glue, Brush, Cup
Prototype for DIY Vase with Wine glass & Rope
Material need: Wine glass/Glass container, Rope, Hot glue gun
While me and Ching Lin were busy with our prototype itself, both of us also discuss about our storyboard for our 3 tutorials and 1 cover design. And I had assigned each of us do one storyboard for tutorial and Cover design.
So for me and Ching Lin, we share one storyboard which is for the tutorial 1(DIY empty tissue rolls). So, I plan out with our storyboard in text, and Ching Lin draw out the storyboard digitally. While for Sam, he will be doing the storyboard of Vase tutorial and cover design. On the other side, daisy were doing the storyboard for the yarn ball.
Storyboard in Text (My part)
Scene 1: End Products of the things
Scene 2: Showing the material.
Scene 3: Measure 2cm on top of the empty tissue rolls, draw the line and cut.
Scene 4: Flatten the tissues roll that had cut into pieces.
Scene 5: Show the amount of pieces of the cutted tissue roll. (Maybe 20??)
Scene 6: Arrange the position with the pieces of tissues rolls to get the final shape of the products.
Scene 7: Glue it (Show one- 2 pieces)
Scene 8: Glue it (Connect with another pieces in order to form the shape)
Scene 9: Glue the last pieces of the tissue rolls to the almost final stage of the products.
Scene 10: Introduce a white spray or any spay(extra), and start spray all over.
Scene 11: Add an accessories on top of the final product. (Flower)
Scene 12: Hang the final product on the wall. (Extra scene)
Storyboard in Digital drawing (Ching Lin Part)
Storyboard of Cover Design in Digital Drawing (Sam)
Material Used: Empty glass, paper star
Animation Used : Stop-motion
Storyboard of Vase tutorial in Digital Drawing
Material Used: Empty glass/Wine Glass, hot glue gun, rope
Storyboard of Yarn ball in Digital Drawing (KyeongJu)
Material Used: Yarn, ballon, white glue, brush
Week 6 & 7
In this 2 weeks, we had start to do our prototype. So, I had assigned the task for doing the prototype according based on the Task activity table.
So for my part, I had made some little changes at the design part of my prototyping compare to our wireframe, due to because the theme and the products of the clay that created by Mr Khing are different based on our original concept of minimalistic design. The Image below will show the part that I have done for my splash screen of our cover Interview, Content of Interview and Back cover page of my prototype.
Splash Page:
Interview Page:
Page 1 : Introduction of Mr Khing
Page 2 : Survey Question (Interview)
Page 3 : Mr Khing Artwork
Back Cover :
Week 8 : Presentation of Prototype
In this week, we have a presentation for our prototype with Mr Razif. So all our file which was created from Ai and Ps file have to convert into MIB file format so that we are able to present it through iPad. However, we also received few comment and suggestion from Mr Razif. So for my part, he had commented about the inconsistency design which some part are lack of somethings and the design element that I had applied on that page doesn't have any related with the content. Beside that, he commented that my part lack of page number for the reader.
Week 9: Fix prototype
After received the comment and suggestion from Mr Razif, I had make some few changes on my prototyping page-Interview. I had added on with the page number and fixed few part of my design which will show be shown below of the following picture:-
Week 10: Editing Tutorial-Video & Animate Splash Screen(Interview) in Ae
This week, I had done video editing with one of our tutorial video - DIY yarn ball and I also animate my interview splash screen in After Effect.
Tutorial Video Editing - Yarn ball
Interview Splash Screen editing :
Week 11-14
In this weeks, I had done the production of our magazine with different software such as InDesign, Edge Animate and After Effect. The part which I had done in our Atelier Magazine are the entire category of interview part, every splash page which include event, craft supply and tutorial splash page and back cover design. Beside that, I also helped on rendering the video from craft supply part which had done by Ching Lin due to the animation can't load in mp4 format when I fast preview to the iPad, so I had help Ching Lin on export her file format to m4v file.
InDesign production for interview part and all the splash screen:
Production in Indesign-Interview part (pg1-3)
Production in Indesign- BackCover
Production in Indesign-Interview Splash
Production in Indesign-Event Splash
Production in Indesign-Tutorial Splash
Production in Indesign-Craft Supply Splash
Final outcome of splash screen:
In addition, Daisy and me are compiling with all the other part from our Atelier Magazine. She was doing the template of the table content for our Atelier Magazine while I was link up all the file together with jump link.