Page 1 of 2

Project 01 - Preliminary

Posted: Fri Sep 13, 2024 10:12 pm
by mmisson_01
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_01_home_pg_01.png
format_01_inner_pg_01.png
Format 02 - Smartphone Size (640 px X 960 px)
format_02_home_pg_01.png
format_02_inner_pg_02.png
(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)
design_a_style_guide_01.png
(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_01_home_pg_01.png
format_01_inner_pg_01.png
Format 02 - Smartphone Size (640 px X 960 px)
format_02_home_pg_01.png
format_02_inner_pg_01.png
format_02_change_pages_01.png
(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)
design_b_style_guide_02.png
.
.
Thumbnails
thumbnails_pg_01_mmisson.png
thumbnails_pg_01_mmisson.png (37.22 MiB) Viewed 514 times
thumbnails_pg_02_mmisson.png
thumbnails_pg_02_mmisson.png (34.55 MiB) Viewed 514 times
thumbnails_pg_03_mmisson.png
thumbnails_pg_03_mmisson.png (29.84 MiB) Viewed 514 times
thumbnails_pg_04_mmisson.png
thumbnails_pg_04_mmisson.png (35.28 MiB) Viewed 514 times
.
Brainstorming
brainstorming_mmisson_01.png
brainstorming_mmisson_01.png (41.3 MiB) Viewed 514 times
.
Site Map
site_map_mmisson_01.png
site_map_mmisson_01.png (35.89 MiB) Viewed 514 times
.
Site Needs & Goals Analysis
project_01_site_needs_&_goals_analysis_mmisson_01-1.png
project_01_site_needs_&_goals_analysis_mmisson_01-2.png
project_01_site_needs_&_goals_analysis_mmisson_01-3.png
project_01_site_needs_&_goals_analysis_mmisson_01-4.png

Re: Project 01 - Preliminary

Posted: Mon Sep 16, 2024 9:55 am
by LMisher
Hello Meghna,

I think that you are definite off to a good start with your website. I am enjoying your work so far. Your thumbnails and brainstorms were on point and your color schemes (especially in version 2) were very nice. My only suggestion would probably be to use white text on the darker background so that it is easier to read. Other than that, it's looking good. Well done!

Re: Project 01 - Preliminary

Posted: Mon Sep 16, 2024 1:33 pm
by ChloieKonrad
Hello Meghna,
I really like both of your designs!
I think my favorite is design B, I really like the Pawprint being the button to switch between pages. My only suggestion is on the smartphone version of Design B, I would make the stripes on the edge go fully around the design like they do on the full web page.
Great Job! :D

Re: Project 01 - Preliminary

Posted: Tue Sep 17, 2024 9:11 pm
by Aub
Wow!! This preliminary work looks too good to be preliminary! I love the designs you made for all the pages I can't wait to see what it looks like in the end, I'm having a hard time trying to find something to nitpick on so maybe it's that some of the black text gets hard to read on the dark blue background, everything else is amazing!

Re: Project 01 - Preliminary

Posted: Thu Sep 19, 2024 3:00 pm
by Olivia_haltom
Hello! I absolutely love the look of your design b. The warm tones give a home, comfort feeling and it's a website I would love to click around on. The hamburger menu design is also looking really strong! Great job! It was also really nice to see your style guid and all the colors you are going to use.

Re: Project 01 - Preliminary

Posted: Fri Sep 20, 2024 6:17 pm
by Seungwoo Lee
Hello. I love your web design and think it's amazing. I think your preliminary work is perfect. I think your thumbnail is also planned and step-by-step. I also think the color of your web design looks good on you. And I think you used the pictures well. I don't know how to replay comments. I think your work is amazing. I really look forward to your final web design. You really did a good work!!

Re: Project 01 - Preliminary

Posted: Fri Sep 20, 2024 11:32 pm
by kevin_ksk
Hi Meghna,



I love how creative and colorful your designs are. I love the little fish hamburger menu. And I like your menus with the fish pole and animal hand. I think I like your A design overall a little bit more. I think the home page’s image fills in the space nicely compared to the design B’s home page. I think the second page for both designs look too different from the home pages. Maybe have more similar backgrounds.

Re: Project 01 - Preliminary

Posted: Fri Sep 20, 2024 11:41 pm
by PAmes
Hi Meghna!

These are all so cute that I can't even really pick a favorite! This was said earlier but I think your main issue is the black type on some darker colors, they would look much better with white on the darker type!

Have a good night!

Re: Project 01 - Preliminary

Posted: Mon Sep 23, 2024 12:28 pm
by Instructor
Meghna, It is always your choice to make the final decision.
I think B design knocks it out of the park, I love the postcard idea!
I think B's Gallery nav buttons could be light orange.
I like the paw navigating button, yet not the human hand pointing to the paw. Could the paw have text on it such as 'roam'?
I think all the work on your excellent work on brainstorming will make the site almost build itself.

Re: Project 01 - Preliminary

Posted: Mon Sep 23, 2024 12:36 pm
by genevieve_dierenga
Hey Meghna,

I really love both of your layouts they are very interesting and fun to look at I think the one I lean towards more is the second one I feel like the color combination has a very strong cohesion across all the pages. I also really like the font choices you used. one thing I do suggest is try to create the same margins across all the pages and the elements on the page. it looks phenomenal!