GRC 175 Learning and Discussion Forum

Hi, here are my 8 roughs + 2 images to show the mobile navigation screen. My bad website is http://art.yale.edu/Home the Yale School of Art webpage. I know this is a commonly known bad website, but I was originally interested in using the students humor in my designs, but I quickly realized that its already perfect for what it is- so instead I just created two layouts that are easy to navigate and should be pleasing to visit. All images used are of Yale University galleries and students* If the 2nd desktop design looks big its bc I added more length to show the scrolling capabilities it would have. And yes it looks like a million pictures bc it is

Here are two competitor sites:
The first- another area of Yale website for comparison https://artgallery.yale.edu/
The second- another School of Art at a college https://www.brown.edu/academics/visual-art/home

Inspiration:
I always look here for web design inspo https://www.awwwards.com/
I took a lot of layout inspiration from this site in its mobile version https://www.artsy.net/gene/yale-univers ... ool-of-art

Let me know what you think!!

These are really modern and professional looking! I love both of homepages, but I’m more drawn to your second design with the little characters that you drew. Those are super cute and make me want to look around the website just to see more. My only suggestion is to try a more interesting font on that design. Maybe a sans serif font to go with the roundness of the characters?

I can't believe you didn't find the artistic value of the original site, LOL JK!! I love what you did for both layouts, it's amazing. The first layouts are great and straight forward, but the second designs really embrace the personality that the original site was trying to convey.(?) I think it would be great if you could animate the little guys, nothing crazy but some sort of action. Great job!

I love the second design it screams "HUMANITY" to me If there was something to change for this design, I would make the navigation items just images, like for home, just have a house, it works better with the overall aesthetics of the page.

Ooooh, nice job taming a really bad one there Emily.

I like your "yale01" designs, myself. That big back image quickly establishes a feel for where we are and shows off the creativity of Yale's art students. Win/win! The image is dark enough that your bold white title stand out against it without much issue. Your text containers are just dark enough to provide contrast and allow you to read the bodycopy. You have good use of margins throughout this composition, but especially on the text containers. I like your design choice on the navigation of muting all the buttons except the page you are on. The nav is still reasonably visible, but it immediately lets you know where you are on the website. I can still read and interact with the faded buttons too.

Where's the Yale Art logo? You'll want to bold your navigation on your inner pages so it stands out against the photo background. Also your line spacing (leading) is a little tight in your title/application system announcement. An extra point or two (or a couple of tenths of an em) will give it some room to breathe.

Nicely done!

I like your first designs better, and congratulations on making a truely terrible website for a college look professional.

Hi Emily, the first one is the best. i like the gallery space image, really feels like you are there and it is impressive.

The first two have a professionalism and maturity I'd associate with Yale. I enjoy the second option as well, but I think the first one is more on target. I like the way you can still see the images through the shaded box. It draws one in while still giving appropriate info. Well done.

I really like the first set just because you incorporated the logo into the design

The second set is my favorite! The little guys are really cute and make me want to see more about this website. However, E is kinds of hard to see (maybe it is just for me), and you could change color or play with the background picture.