project 1 preliminary

Post links to your Project One websites for discussion and feedback.
missStormy
Posts: 44
Joined: Tue Jan 28, 2020 6:54 pm

project 1 preliminary

Post by missStormy »

Hello

Here are my 4 rough drafts.

The are actually two main designs that are Split into two view ports, one for desktop and mobile.

Rough Draft B is very experimental. It started of as a sketch and I wanted to include it in my website design. At this point it's extremely sketchy but I like the chaotic energy it has. I believe I need to refine the background image to more of a digital illustration. The navigation is very un-ordered but again, it is suppose to give a chaotic feel. Much of it needs much refining though.

Rough Draft A in comparison is far more organized and more professional looking. While there's no obvious navigation bar or footer the design is simple and easy to navigate. It is very simple though and can be read as boring. Much like my other rough draft if I refine my typography and images.

Here are my two inspirational websites.

I like both of these websites, the first one uses nice illustrations while incorporating good grid elements. The other one inst as illustrative but I love how everything is organized into a engaging layout.

http://seanhalpin.io/
https://tobiasahlin.com/

Here's another one that shows what direction I was going with for the illustrative draft.
https://www.rybatzki.com/design
Attachments
project01-mobile-A-RD.png
project01-mobile-B.png
project01-desktop-B-RD.png
project01-desktop-A-RD.png
Last edited by missStormy on Tue Feb 11, 2020 6:43 pm, edited 1 time in total.
Stormy

meekster_
Posts: 35
Joined: Tue Jan 28, 2020 7:10 pm

Re: project 1 preliminary

Post by meekster_ »

I actually really like the look of the sketch design! it has a glitch look and I think that's super cool! it also has this nice zig-zag layout that your eyes follow which I think is nice! I also like the purple and the white color combo. I think the thing I would change however, would be the about you paragraph, it is a little hard to see, maybe make it bolder ?
~Mika Miller~

CedarM
Posts: 113
Joined: Tue Jan 28, 2020 7:05 pm

Re: project 1 preliminary

Post by CedarM »

I really like the experimental design, especially the mobile version. One thing you could do to make the computer version stronger is to rotate the background design so its on its side and fills the background better.
- Cedar Moosmuller

User avatar
suiish
Posts: 44
Joined: Tue Jan 28, 2020 6:51 pm

Re: project 1 preliminary

Post by suiish »

I really like your experimental design, however the text kind of becomes hard to read against the sketch background. I suggest making the sketch a bit smaller or maybe adding solid backgrounds wherever there is text that way you can read the type.
This is Briana Flores, in case you forgot! :D

User avatar
SkellyboneJones
Posts: 44
Joined: Tue Jan 28, 2020 7:00 pm

Re: project 1 preliminary

Post by SkellyboneJones »

The clean design looks nice and formal, very professional. However, I definitely like the sketchier one more. You could definitely combine that visual style with some other elements like VHS Video overlays or Pixel filters for a really neat aesthetic. Either way, both designs are strong for different reasons.
This is Trevor. So if you don't know, now you know.

User avatar
JamesC46
Posts: 45
Joined: Tue Feb 04, 2020 6:04 pm

Re: project 1 preliminary

Post by JamesC46 »

The clean design looks nice, but the experimental has a better navigation in my opinion. My explanation for that is the inconsistent size (at least for mobile), positioning and color of the links in the first rough makes it look like header text and sub-header, which can make it confusing. Even though the experimental design is supposed to be chaotic, it's actually more consistent than the first.

Thanks for sharing!
James Chumpol

User avatar
sndbox
Posts: 40
Joined: Tue Jan 28, 2020 6:25 pm

Re: project 1 preliminary

Post by sndbox »

I like the design with the sketch, but some of the smaller fonts (like the email) are a little difficult to read, so maybe making those white or choosing a bolder font for those may work better!
Sandra R.
san-druh

KJX
Posts: 35
Joined: Tue Jan 28, 2020 6:59 pm

Re: project 1 preliminary

Post by KJX »

Hey! I like the extreme pulls on your second website, but overall depending on the image you want to give your viewer I would suggest to pick your first design(blue version). But it would be rad to pick the maroon version.

-KJ

hmayooo
Posts: 20
Joined: Tue Jan 28, 2020 6:51 pm

Re: project 1 preliminary

Post by hmayooo »

I think version B is definitely really strong, both in navigation and in the design! It's definitely really creative and I was drawn to it immediately. I do think some of the text can be difficult to read if it overlaps the sketchy lines, so maybe bumping some of the paragraph over to the left a little more to get that text off of the background image would be helpful. I also like the colors you chose for version A, but to me the navigation link seem a little too big and it kind of throws off the balance of the design. Overall I would definitely vote for version B. :)
~Hayley Mayo~

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

Re: project 1 preliminary

Post by Instructor »

Color me a weirdo, but I like the glitchy "Design B"s myself. They have a theme and eccentricity that your "Design A"s lack.

The "Design B" scribbles look like the work of someone who is psychologically disturbed and I rather like 'em. The scribble itself has all kinds of patterns and textures in it for the eyeball to feast on. And your typography is just about perfect. The choice of the glitchy font for your titles, buttons, and links was genius. It looks like the menu screen for some sort of horror video game. For all that, it still has really superb use of contrast. Everything is easy to read, see, and use, despite all the texture getting slung around here. Good use of margins too. If you didn't have the scribble, everything would be way too far apart, but with the scribble, it's all visually tied together.

I wouldn't bother indenting your bodycopy paragraph. Just make sure it has the same left edge on it that your title does. On your computer version, make sure the background of the webpage matches the background of your scribble. Right now they're different colors and it clashes. Alos, make sure that "Spring 2020" has the same left edge as "Web Design and Publishing 1".

Nicely done!
"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