Project01, Final Designs

Post links to your Project One websites for discussion and feedback.
User avatar
Meghna_Misson
Posts: 114
Joined: Mon Jan 25, 2021 10:37 am

Project01, Final Designs

Post by Meghna_Misson »

Hi everyone,

Here are my final designs for Project01. For these, I decided to use a different layout, main image, and color scheme that were completely different from my first three roughs shown in the first preliminary critique, however I had used the same elements from all of them to incorporate into this final design's structure.

For the layout of my website on the computer screen, I was mainly inspired from an image of a website for the popular video game, Call of Duty, (which can be found here: https://blog.hubspot.com/marketing/grap ... -portfolio, underneath "Mingfei Yang"), since it had all the required text placed to one side while the main image and the title were on the other--balancing out the two. Although, this had proved to be some challenge because I had my name scaled down and placed to the right, which did not even out my image on the bottom right. To fix that, I had placed the social media icons on the bottom right corner along with my bio description near the top right. This way, it did not make the overall look of the website to appear teeter-tottering onto the left side more than the right.

Another detail that I had included into this design for the computer screen version was the gray dashed line joining the pages together; this was mainly inspired from a infographic about the music artist, Chance the Rapper, after researching for reference images for another project. I liked how it had interlinked the topics together that was not too bold and not too hard to see, so I thought it would be best to mimic the graphic element onto this design.

One more website that had inspired me on this process, especially for the mobile version of my website, was https://www.wix.com/blog/2020/02/mobile-website/, which had numerous amounts of different websites created for mobile. While scrolling though, it had reminded me of the process for designing apps--that since the website was now on a smaller screen, the information will have to be scaled down and some text will need to be placed on additional pages in order to not overcomplicate the design of the homepage. So now when the next project calls for us to make our mobile version workable, the user will be taken to another page holding the information they wanted after having clicked the page name associated (for example: click on "projects>redirects you to another page listing. all four projects>clicks on one specific project out of that list>now redirected to the page holding the necessary content of that assignment).

final_image_01.png
final_image_03.png
final_image_02.png
Meghna Misson - student

Anayik
Posts: 101
Joined: Sat Jan 30, 2021 10:43 am

Re: Project01, Final Designs

Post by Anayik »

Hi Meghna,

I really like your cool flout menu. And your imagery is really beautiful as well, creates nice contrast. You could consider dropping your image lower (if possible) so you have more of the sky showing and give your text some more space
Kiana Bohm

gavin_clouser
Posts: 96
Joined: Sat Feb 06, 2021 10:03 am

Re: Project01, Final Designs

Post by gavin_clouser »

I think it may be the image you uploaded but the body copy is kind of hard to read. But the layout and look of this is really cool. I especially like your nav bar. Good start!!
gclouser701

Kassandra
Posts: 118
Joined: Mon Jan 25, 2021 7:42 am

Re: Project01, Final Designs

Post by Kassandra »

Hi Meghan,
This is a really cool design. I love how you are going to have your projects displayed once someone hovers over your projects section. This turned out great!
Kassandra Fuentes

User avatar
it's_crysta
Posts: 117
Joined: Tue Jan 26, 2021 8:48 pm

Re: Project01, Final Designs

Post by it's_crysta »

I really like the muted tones and the whole vibe your layout has. On the mobile version I feel like your header bar and navigation bar should be touching so there's not that gap in the middle. Good work! It looks great.
it's Crysta (Clark)

i feel like i'm on neopets again

User avatar
Hamistani
Posts: 144
Joined: Mon Feb 01, 2021 10:58 pm

Re: Project01, Final Designs

Post by Hamistani »

Hello Meghan,
I really like what you've done with this layout! I really like the muted color scheme. The margins between the navigation buttons are very nice. The text is easy to read, and the fonts are nice. For the mobile version, I would make the navigation buttons similar to the computer layout or make the background color dark gray instead of black. Overall, great job! :D
- Heather Amistani
Ehhh, What's up Doc? ;)

User avatar
jacklyn_yamine
Posts: 144
Joined: Fri Feb 05, 2021 5:21 pm

Re: Project01, Final Designs

Post by jacklyn_yamine »

Hi Megna,
Very cool! I really liked your first design from the prelim critique but this one takes the cake. I love the detail of the dotted line that leads from one menu item to the next and that mountain image with the fog is very nice with the more muted gray tones and colors.
JacklynYamine

sal_baraj
Posts: 64
Joined: Thu Jan 28, 2021 4:31 pm

Re: Project01, Final Designs

Post by sal_baraj »

Hi Meghna,
I love your overall concept for your webpage, I can see you love the outdoors and have an appreciation for it. This is key to designing a personal website and something that isn't always fully grasped by the designer. Great job

dearangela
Posts: 65
Joined: Thu Jan 28, 2021 6:11 pm

Re: Project01, Final Designs

Post by dearangela »

Hey Megnha,

Love the vibe here, gray never looked so good! The nice exposure and green and sky feel very adventurous and wonderous, and I like the white rectangles under your text on your mobile. I would your type GRC etc... can be a bit bigger, other than that really awesome job!
angela_gutierrezgapuz

User avatar
Instructor
Site Admin
Posts: 1869
Joined: Thu Jul 21, 2011 8:51 am

Re: Project01, Final Designs

Post by Instructor »

Oooof, so atmospheric. I'm feelin' it just glancing at this thing.

My oh my, you PIVOTED from your preliminary work and it came out excellent. The atmosphere is so thick on this one. Your photo is a perfect choice. It'd visually interesting and haunting. A disquieting deep nature feel. What's hidden in those hils. It's got a Twin Peaks/Silent Hill vibe. Your top bar and navigation even look a bit like a video game interface. That nav is super easy to see and use and I really like the ribbon flyout menu. It and the top bar make for a great frame for your image. One little piece of alignment that I like is the dotted line of your navigation pointing directly at the top of the mountain on the TMCC logo. Your class info, logo, and navigation type works really well. The muted colors really help the cold afternoon feeling you have here. You wisely opted to use no colors for your design and let the image supply all the colors. I also like your use of transparency on your mobile version. It doesn't disrupt the continuity and solves an obvious problem.

I don't think your bodycopy needed to be a medium italic. I think a lighter type would have served better given the atmosphere you've got going on here. Your left, right, and bottom margins at the bottom of your navigation on your computer layout are very tight as is the right margin on your class info up top.

Great work! Now I gotta go bundle up and drink some hot tea. Your composition has given me a chill.
"Inspiration is for amateurs. The rest of us just show up and get to work." — Chuck Close

Michael Ganschow-Green - GRC 175 Instructor
mganschow@tmcc.edu | 673-8200 ext.5-2173

Locked