#02 STORYBOARD AND MOODBOARD

#01-01 #01-02

#01-08 #01-03 #01-04 #01-06 #01-05

Draft

SONY DSC

Workflow

#01-09

These are wireframes of website. I check the functions in Wix first and design usable layouts. Swatches will be applied to video intro. I may not use the menu texts to be neat. Instead, I use symbols which represent each page and activate a linkage. Place categories are divided by three parts by ages. Once you enter a category, there is a rough map and pins to guess each position easily. Also I provide big size of photos by clicking them. I am thinking of the each name of the pages.

Download the PDF Storyboard02

MOODBOARD

moodboard

Storyboard-07

Mood board is a sort of collage. In advance of professional artwork, it helps you work efficiently as your guide. Every sample which you imagine is contained in mood board. The things could be anything; Styles, color, layout, graphics, textures and so on. If a draft is prepared, the next thing to do is to improve the first design increasingly. I select various colors from official Seoul’s color chart. I won’t use all colors in swatch and might use another color but main colors are still valid.

Download color PDF 서울권장색600
Download Official color chart http://www.seoul.go.kr/v2012/seoul/symbol/color.html

  • Website UI reference

http://ko.wix.com/website-template/view/html/1329

http://www.wix.com/website-template/view/html/712?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fcreative-arts%2F5&bookName=create-master-new&galleryDocIndex=0&category=creative-arts&metaSiteId

http://www.wix.com/website-template/view/html/1198?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fcreative-arts%2F4&bookName=create-master-new&galleryDocIndex=4&category=creative-arts&metaSiteId

http://www.wix.com/website-template/view/html/796?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fcreative-arts%2F9&bookName=create-master-new&galleryDocIndex=5&category=creative-arts&metaSiteId

Icon design
http://www.wix.com/website-template/view/html/689?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fcreative-arts%2F9&bookName=create-master-new&galleryDocIndex=4&category=creative-arts&metaSiteId

Music concept
http://www.wix.com/website-template/view/html/1580?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fall%2F1&bookName=create-master-new&galleryDocIndex=3&category=all&metaSiteId

http://www.wix.com/sample/website-viewer?lng=en&site_id=1365334433635520

http://www.jvcmusic.co.jp/singing-rib/

Photo Slide http://www.wix.com/sample/website-viewer?lng=ko&site_id=1361362485073471
Video start http://www.wix.com/sample/website-viewer?lng=ko&site_id=1375859330013584
Graphic style http://www.wix.com/sample/website-viewer?lng=ko&site_id=1416729332143582
Photo effects and calligraphy http://nos.twnsnd.co/
Logo and slogan style http://www.splitshire.com/
Icon design references https://dribbble.com/shots/1633338-Icons-for-Android-L

  • Free Image download website

http://viintage.com/
http://www.1millionfreepictures.com/
http://pixabay.com/en/photos/?order=best&cat=science
http://www.publicdomainpictures.net/
http://www.pdpics.com/
http://wefunction.com/free-photos-vol-3/
http://designspiration.net/image/1495779319062/

Free soundtrack download website http://www.mobygratis.com/

#02 STORYBOARD AND MOODBOARD

#01 STORYBOARD AND MOODBOARD

  STORYBOARD

Storyboard-01

Storyboard-02

Storyboard-05

Storyboard-03

Storyboard-04

Storyboard-06

Storyboard-08

SONY DSC

These are wireframes of website. I check the functions in Wix first and design usable layouts. Swatches will be applied to video intro. I may not use the menu texts to be neat. Instead, I use symbols which represent each page and activate a linkage. Place categories are divided by three parts by ages. Once you enter a category, there is a rough map and pins to guess each position easily. Also I provide big size of photos by clicking them.

Download the PDF Storyboard

MOODBOARD

moodboard

Storyboard-07

Mood board is a sort of collage. In advance of professional artwork, it helps you work efficiently as your guide. Every sample which you imagine is contained in mood board. The things could be anything; Styles, color, layout, graphics, textures and so on. If a draft is prepared, the next thing to do is to improve the first design increasingly. I select various colors from official Seoul’s color chart. I won’t use all colors in swatch and might use another color but main colors are still valid.

Download color PDF 서울권장색600
Download Official color chart http://www.seoul.go.kr/v2012/seoul/symbol/color.html

  • Website UI reference

http://ko.wix.com/website-template/view/html/1329

http://www.wix.com/website-template/view/html/712?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fcreative-arts%2F5&bookName=create-master-new&galleryDocIndex=0&category=creative-arts&metaSiteId

http://www.wix.com/website-template/view/html/1198?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fcreative-arts%2F4&bookName=create-master-new&galleryDocIndex=4&category=creative-arts&metaSiteId

http://www.wix.com/website-template/view/html/796?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fcreative-arts%2F9&bookName=create-master-new&galleryDocIndex=5&category=creative-arts&metaSiteId

Icon design
http://www.wix.com/website-template/view/html/689?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fcreative-arts%2F9&bookName=create-master-new&galleryDocIndex=4&category=creative-arts&metaSiteId

Music concept
http://www.wix.com/website-template/view/html/1580?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fall%2F1&bookName=create-master-new&galleryDocIndex=3&category=all&metaSiteId

http://www.wix.com/sample/website-viewer?lng=en&site_id=1365334433635520

http://www.jvcmusic.co.jp/singing-rib/

Photo Slide http://www.wix.com/sample/website-viewer?lng=ko&site_id=1361362485073471

Video start http://www.wix.com/sample/website-viewer?lng=ko&site_id=1375859330013584

Graphic style http://www.wix.com/sample/website-viewer?lng=ko&site_id=1416729332143582

Photo effects and calligraphy http://nos.twnsnd.co/

Logo and slogan style http://www.splitshire.com/

Free Image download website

http://viintage.com/
http://www.1millionfreepictures.com/
http://pixabay.com/en/photos/?order=best&cat=science
http://www.publicdomainpictures.net/
http://www.pdpics.com/
http://wefunction.com/free-photos-vol-3/
http://designspiration.net/image/1495779319062/

Icon design references

https://dribbble.com/shots/1633338-Icons-for-Android-L

#01 STORYBOARD AND MOODBOARD