project_one_preliminary_01

[keatonbeatty]

Hello!
My name is Keaton and here are my website and mobile designs,
For my first set of layouts, I really wanted to focus on the colors, which were a mixture of forest greenish hues and creams. I decided on a black-and-white picture of myself to kind of add some balance and a break between the colors through the use of the black tones within the picture. I wanted to go with a single typeface so I chose "Helvetica" because it has so many different weights that all look different, but all share a cohesive element. I got a lot of inspiration from the websites I visited, especially about the color theories I wanted to use within my design and the simplicity of the type on a webpage as well.
For the second set of layouts, I really wanted to add a textural element, which I did by finding a cool plant pattern on the internet. I also wanted there to be a bit more emphasis on my logo itself in these designs so I tried to make it a bit more prominent throughout. I still did use Helvetica in these designs as well as the same color palette. Overall I wanted the layouts to be simple and gridded out to create consistency, but I also wanted them to show a bit of personality as well.
I'm thinking back now and wondering if I should go back and use more of a black or grey to add some more depth, or perhaps overlapping type... but I'm not sure yet so any advice on that would be cool!

web_mockup_01(web).png (5.9 MiB) Viewed 878 times

web_mockup_02(web).png (5.7 MiB) Viewed 878 times

[url]https://zyro.com/blog/portfolio-website-examples//url]
[url]https://www.sitebuilderreport.com/inspi ... amples/url]

[kelseymarie_ba]

Hi Keaton,
I really like the green tones you've used for your designs! I think I enjoyed your second layout more, the pattern in the background is a great accent to your layouts. Something that could help your layout would be changing the "GRC175 Web Design and Publishing I, Spring 2023 and Truckee Meadows Community College" to a smaller font size. Hope that helps, can't wait to see what you make this semester! Good luck!

Kelsey Bautista

[isaacm03]

Hello Keaton!

I'm a big fan of both of your layouts! I think the color choices are great, and they help establish a lot of personality in the prelim. Personally, I am leaning towards the second layout because I think the background pattern helps establish more of that personality. On the topic of adding depth, maybe some drop shadows on the buttons will help pull them a bit off the page, making certain elements look less flat.

I like the multiple type styles you have going on in both layouts, like the italicized and bold styles. If you wanted to make the text a bit easier to read, you can lighten up the background pattern a bit, as I think it is blending in just a bit too much. Either way, you did great and I can't wait to see the final!

[YoAdrian!]

Hi Keaton,
It's nice to meet you. I'm really liking both of your designs. I sat here and stared at the two of them trying to figure out with one I liked best and I can't really chose. Maybe the 1st one??? Argh...ok, well I really enjoy how you made the photo of yourself and the paragraph the main feature of the site, it flows really well from the web version to the mobile version. The yin and yang of your green tones is really fun to look at. The only improvements I can see would be to add more areas/links to the 1st design for future projects and resources, maybe a simple menu button? Or just copy what you did on the 2nd design with the icons and buttons? It's all looking really good.

[yasmin_bean]

Hello Keaton,

I think the simple design works very well for your website. For that reason, I think the best design is the second set because the first feels like it's cutting off halfway through the page on both the computer and the phone. But for the second set I'd recommend making the paragraph font a little bigger so people who have issues reading won't struggle with the thin lines. Good job and I look forward to seeing more from you.

[Instructor]

Oh, I'm all about that second design, Keaton. I think it's the background pattern that attracts me.

The strongest bit about your second design is actually the lack of boxes. It does a really good job of hiding the layout boxes and letting the content elements stand on their own. It's a clean layout that hands off the visual interest to your photo as well as that kickass background pattern. That background pattern provides so much visual interest and texture to this thing. And you have it at the perfect opacity so it does not distract from the rest of your layout. Your sans-serif type is working well. It's easy to read and goes nicely with the composition. Good use of margins through most of the layout. Everything seems to have a little bit of room to breathe. Your navigation button pills are working well. They seem easy to see and use and have a nice contrast with the background.

I think you can even do without the colored header on your computer rough. Go further into the no box theme you've got going on here. Maybe put the "KB" next to "K. Beatty Graphics" and enlarge it now that you don't have to make it fit in a header. Plus I like the way the "KB" blends in with the pattern on your mobile version. Speaking of your mobile version, I don't think you need to change it quite that radically from your computer layout. I think you can keep the single column layout you have and use the same background and button colors as you have on your computer layout. I would make sure all of your buttons have equal padding or size all of the buttons off the longest one. Also, either shrink your bodycopy a point or two or widen the text area a little so "2023" is on the same line as "Spring" in your class info.

Good work!

[Juan Lara]

Hello Keaton,

I really like both of your designs, especially your second set of layouts. The use of a monochromatic color scheme and the elements on the page really compliment each other well to create visual harmony. However, If I were to suggest something, I think you could do more with white space and typography to make your page out stand out even more and create a more prominent sense of hierarchy within your elements. Aside from that, though, I think you're on the right path.

[Erikatsukamoto]

Hey Keaton! All of these designs look super good. Having a very difficult time choosing which one I like more. At first I was leaning towards the first design, but now I'm thinking the second design, especially with the phone version. The background pattern that you chose with the plants looks fantastic, especially with your initials over it. The only thing I can think of changing with this design is maybe seeing what the rectangle behind "KT K. Beatty graphics" would look like if it had rounded edges. I only say this because your rectangles behind the projects are rounded, so just to match that. Otherwise, really great job.

[bmeyer]

Hi Keaton!
I love green and I love both of your designs! They are both very clean and well-organized, while also being expressive. I think my favorite of the two is the second one.
The only advice I have would be to switch or add the first font to the second design because I think it would help with hierarchy. Good Job!
-Bella

[qcottel]

Keaton!

I love the second website designs!
Not to say i don't like the first designs, I just think the second one shows off more of your skill set as a designer and I think it would benefit you to keep going in that direction!

Good work as always!