Project 01 - Preliminary
Posted: Fri Sep 13, 2024 10:12 pm
Hi everyone,
Here is all of my preliminary work for Project 01!
The person that I chose to revolve my website around is "Fourleaf-Island", otherwise known as Willow Woods or Wyll. If this name might seem familiar, they are best known for their webcomic "Laika's Comet" on Tumblr and Webtoons!
(You can check it out here, it's a really enjoyable read and Willow's use of color theory will absolutely blow you away! https://www.webtoons.com/en/canvas/laik ... _no=857623)
This was also a part of the sole reason as to why I choose Fourleaf-Island in the first place for this project, since discovering them early this year has helped tremendously with my own drawing and coloring process.
(Here is another link to be directed to Fourleaf-Island's Tumblr Blog if you want to view their other work as well: https://fourleafisland.tumblr.com)
DESIGN A
Format 01 - Standard Size (1920 px X 1080 px)
(For Design A, I wanted to go with a more simple and clean approach in order to get back in the groove using Dreamweaver. I also did not want to overburden myself with trying to add in a lot of elements that I don't know how to code for yet, but I am still very eager to try out new things such as the animated fishing-rod drop-down list as viewed here:)
Format 02 - Smartphone Size (640 px X 960 px) (Since the fishing-rod element can't really be used in this format without complicating things, I thought it would be best to switch it to a scrollbar to indicate that the page the user is currently on has more below it than what's visible on their screen. So when a user slides their finger up to scroll down all the way to the bottom, the fishing-rod would *reel* in the fish).
Style guide for Design A (640 px X 960 px) (If you'd noticed, I didn't really use the icon a part of the typographic logo throughout Design A very much, but if I do go through with this Design, I will probably make sure to incorporate it more than what I did here in the preliminary work).
.
DESIGN B
Format 01 - Standard Size (1920 px X 1080 px)
(For Design B, I was really intrigued to know Fourleaf-Island had an exclusive print club on their Ko-fi page, so I thought what better than to incorporate a postcard layout throughout this design to relate to that aspect! As you can tell, this is widely different from Design A, however, it will definitely be more of a challenge trying to replicate everything here through Dreamweaver, but I am especially delighted with how this design looks for now).
Format 02 - Smartphone Size (640 px X 960 px) (The additional inner page is to show how the user can switch between pages, via the red-paw button on the lower left corner of the screen).
Style guide for Design B (640 px X 960 px) .
.
Thumbnails .
Brainstorming .
Site Map .
Site Needs & Goals Analysis
Here is all of my preliminary work for Project 01!
The person that I chose to revolve my website around is "Fourleaf-Island", otherwise known as Willow Woods or Wyll. If this name might seem familiar, they are best known for their webcomic "Laika's Comet" on Tumblr and Webtoons!
(You can check it out here, it's a really enjoyable read and Willow's use of color theory will absolutely blow you away! https://www.webtoons.com/en/canvas/laik ... _no=857623)
This was also a part of the sole reason as to why I choose Fourleaf-Island in the first place for this project, since discovering them early this year has helped tremendously with my own drawing and coloring process.
(Here is another link to be directed to Fourleaf-Island's Tumblr Blog if you want to view their other work as well: https://fourleafisland.tumblr.com)
DESIGN A
Format 01 - Standard Size (1920 px X 1080 px)
(For Design A, I wanted to go with a more simple and clean approach in order to get back in the groove using Dreamweaver. I also did not want to overburden myself with trying to add in a lot of elements that I don't know how to code for yet, but I am still very eager to try out new things such as the animated fishing-rod drop-down list as viewed here:)
Format 02 - Smartphone Size (640 px X 960 px) (Since the fishing-rod element can't really be used in this format without complicating things, I thought it would be best to switch it to a scrollbar to indicate that the page the user is currently on has more below it than what's visible on their screen. So when a user slides their finger up to scroll down all the way to the bottom, the fishing-rod would *reel* in the fish).
Style guide for Design A (640 px X 960 px) (If you'd noticed, I didn't really use the icon a part of the typographic logo throughout Design A very much, but if I do go through with this Design, I will probably make sure to incorporate it more than what I did here in the preliminary work).
.
DESIGN B
Format 01 - Standard Size (1920 px X 1080 px)
(For Design B, I was really intrigued to know Fourleaf-Island had an exclusive print club on their Ko-fi page, so I thought what better than to incorporate a postcard layout throughout this design to relate to that aspect! As you can tell, this is widely different from Design A, however, it will definitely be more of a challenge trying to replicate everything here through Dreamweaver, but I am especially delighted with how this design looks for now).
Format 02 - Smartphone Size (640 px X 960 px) (The additional inner page is to show how the user can switch between pages, via the red-paw button on the lower left corner of the screen).
Style guide for Design B (640 px X 960 px) .
.
Thumbnails .
Brainstorming .
Site Map .
Site Needs & Goals Analysis