Here are my roughs for project 1. Winter is my favorite season, so in both of my roughs, I decided to use a cold landscape; I wanted to do a video game theme, but I didn't want to give the wrong impression that I am a video game developer because I am not (tho it does sound interesting to do). In my first rough, I wanted it to be bright and dynamic, so I'm looking into imagery that takes place during the day and choosing bright colors. The layout I want to play with it to fit with triangle panels so it can maybe feel dynamic. In my second rough, I wanted some sort of dark and moody setting. I thought I use snowy landscape at night and make use of dark colors.
Below are the websites I would find Inspirationals. What inspired me about them is how to interact with them. The webpage would just constantly change the content as you scroll down, it felt like I was interacting with something of what I thought before that shouldn't be possible on a web browser, but it does. The effects were just amazing, and I just had a great time traversing these two guys' portfolios. I want to figure out how these effects are done in the future. Now other than that, they really kept the content of each section very simple. There weren't too many things to digest, all of which help when going through their effects.
Inspiration Links:
https://dwl.media/
[img]https://kuon.space/#reile[/url]
Articles:
https://designmodo.com/design-type-photo/
https://designmodo.com/create-online-portfolio/
Project 1 Preliminary
-
- Posts: 142
- Joined: Tue Jan 26, 2021 8:26 pm
Project 1 Preliminary
Jordi Cruz Trujillo
Re: Project 1 Preliminary
Hi Jordi,
I think your designs are very clean and organized really well. I’m leaning towards the second set of designs as the imagery works so well with your text and headline. And the picture naturally features a really beautiful gradient. I know overall it’s a super simple layout but it all the placement choices work SO good together and it feels super professional.
I think your designs are very clean and organized really well. I’m leaning towards the second set of designs as the imagery works so well with your text and headline. And the picture naturally features a really beautiful gradient. I know overall it’s a super simple layout but it all the placement choices work SO good together and it feels super professional.
Rowena Piñero
"My vibe is like, hey you could probably pour soup in my lap and I'll apologize to you."
"My vibe is like, hey you could probably pour soup in my lap and I'll apologize to you."
- kendall_the_mann
- Posts: 146
- Joined: Wed Jan 27, 2021 2:31 am
Re: Project 1 Preliminary
Hi Jordi!
I absolutely love the design of the first set! The triangles are so cool and the way they overlap creates awesome leading lines for your text to follow! I think I like the deeper colors of the second one a bit better, and it'd be cool to see that incorporated into the first design!
Awesome job, I can't wait to see your final website layout : )
I absolutely love the design of the first set! The triangles are so cool and the way they overlap creates awesome leading lines for your text to follow! I think I like the deeper colors of the second one a bit better, and it'd be cool to see that incorporated into the first design!
Awesome job, I can't wait to see your final website layout : )
-Kendall Mann
Re: Project 1 Preliminary
Hi Jordi,
I really like your layouts! I love the first one the best because I love the use of the diagonal lines used to draw the eye to each side. I also like the light colors used. It matches the scene of the snow. It would be cool if the colors changed when moving your cursor over "references, resources, and projects" sections or making them into a button somehow. It looks nice cause there is depth to it also. Good job!
I really like your layouts! I love the first one the best because I love the use of the diagonal lines used to draw the eye to each side. I also like the light colors used. It matches the scene of the snow. It would be cool if the colors changed when moving your cursor over "references, resources, and projects" sections or making them into a button somehow. It looks nice cause there is depth to it also. Good job!
KATHY RUECKL
Re: Project 1 Preliminary
Hi Jordi!
I would say that your second design is by far the strongest one! I like the background, the fonts, and the gradient at the bottom. I would change "I am Jordi Cruz Trujillo". The "I am" aligned to the bottom left of the "J" throws the whole thing off. Even though they are aligned, the balance throws me off and looks uneven. I would add more to your summary, or center it in the middle as there is a lot of empty space on the bottom in design 2. I would also align all the tabs to each other, that way "Resources" is not higher than the rest in the mobile version. For the computer version, I would center the logo with your GRC 175 type.
Overall the colors and the composition in your second design is very strong!
I would say that your second design is by far the strongest one! I like the background, the fonts, and the gradient at the bottom. I would change "I am Jordi Cruz Trujillo". The "I am" aligned to the bottom left of the "J" throws the whole thing off. Even though they are aligned, the balance throws me off and looks uneven. I would add more to your summary, or center it in the middle as there is a lot of empty space on the bottom in design 2. I would also align all the tabs to each other, that way "Resources" is not higher than the rest in the mobile version. For the computer version, I would center the logo with your GRC 175 type.
Overall the colors and the composition in your second design is very strong!
Isabelle Bento (the person with the basic anime girl hair cut) UwU
https://www.youtube.com/watch?v=dQw4w9WgXcQ
https://www.youtube.com/watch?v=dQw4w9WgXcQ
- it's_crysta
- Posts: 117
- Joined: Tue Jan 26, 2021 8:48 pm
Re: Project 1 Preliminary
Hi Jordi,
I like the typeface you picked for your first design, it being a little more different than the font you used for your bodycopy helps a lot. I also like the over lapping transparent triangles over the background. I would try making the one on the right start at a different height than the one on the left just to add more variety and so they're not both starting at the top corners. Putting the shorter word on top and the longest on the bottom of you references/resources/projects type would help it fit in better and follow along the diagonal of your shape. Good work, looking forward to the finished design!
I like the typeface you picked for your first design, it being a little more different than the font you used for your bodycopy helps a lot. I also like the over lapping transparent triangles over the background. I would try making the one on the right start at a different height than the one on the left just to add more variety and so they're not both starting at the top corners. Putting the shorter word on top and the longest on the bottom of you references/resources/projects type would help it fit in better and follow along the diagonal of your shape. Good work, looking forward to the finished design!
it's Crysta (Clark)
i feel like i'm on neopets again
i feel like i'm on neopets again
Re: Project 1 Preliminary
Hi Jordi,
I'm with you, I love winter. It's a tough pick, you chose some nice imagery here. But I think my favorite is the night time concept. The image you chose here really sets up a perfect composition for your text...and has amazing contrast. Plus it's beautiful! I like your use of a gradient at the bottom but on my screen it looks green (?) which doesn't feel cohesive with the rest of your project. Maybe use the eyedropper tool to grab a blue from your image. Also, try bumping your "about me" text up a little closer to your name. Right now they feel like they're floating apart.
I'm really excited to see which way you go!
I'm with you, I love winter. It's a tough pick, you chose some nice imagery here. But I think my favorite is the night time concept. The image you chose here really sets up a perfect composition for your text...and has amazing contrast. Plus it's beautiful! I like your use of a gradient at the bottom but on my screen it looks green (?) which doesn't feel cohesive with the rest of your project. Maybe use the eyedropper tool to grab a blue from your image. Also, try bumping your "about me" text up a little closer to your name. Right now they feel like they're floating apart.
I'm really excited to see which way you go!
Kiana Bohm
- ItsAllisxn
- Posts: 137
- Joined: Tue Jan 26, 2021 7:46 pm
Re: Project 1 Preliminary
Hi Jordi!
These are both some really cool layouts you have. Personally, I really like your second layout. It works really well with both the mobile version and the web version. The dark colors with the white text and font choices looks great. My only suggestion is changing the color of the gradient, I'm not too sure how well it fits with the image. I think making it a dark blue to match the background would work really well. Besides that though, awesome job! This is a really clean and appealing design.
These are both some really cool layouts you have. Personally, I really like your second layout. It works really well with both the mobile version and the web version. The dark colors with the white text and font choices looks great. My only suggestion is changing the color of the gradient, I'm not too sure how well it fits with the image. I think making it a dark blue to match the background would work really well. Besides that though, awesome job! This is a really clean and appealing design.
Allison Hartmann - Kachow
- Instructor
- Site Admin
- Posts: 1945
- Joined: Thu Jul 21, 2011 8:51 am
Re: Project 1 Preliminary
Wow! Another person who has posted two equally good designs. I think is is like the sixth or seventh time this has happened now. I've lost count. Pick whichever design speaks to to you, Jordi. They are equally good.
Great use of transparency of your first one here. The transparent triangles have just enough alpha to reduce the detail of the images behind without completely masking the detail. I also really like how the angle of the triangles matches the angle of the trees. It really ties everything together too. Great background photo here. It's really the fount from which this entire design springs and everything else compliments it. Nice use of color as well. It really brings in an icy winter wonderland feel that you first established with that excellent background photo. Your typeface selection is working too. The two sans-serifs seem to be cooperating nicely.
I don't know that your bodycopy necessarily needs to be that bold. I wonder what it'd look like if it was a little lighter weight.
Your second design has a beautiful starry night feeling with vague mysterious undertones. I think it's the green glow in your footer that gives it a slightly spooky feel. Once again you've chosen an excellent photo. It's dark, and colorful, and mysterious, and it immediately establishes a tone that you roll with and enhance with that glowing footer. I'm glad that you resisted the temptation to add more color and let the background image do most of the talking. The white type shines against it. Good type selection as well. Your fonts are all working well together.
I'd run a gradient mask on the bottom of your background photo so that you don't have a hard edge at the bottom. I'd also add a bit more space between your navigation buttons on your mobile layout. Right now they run together a bit.
Excellent work!
Great use of transparency of your first one here. The transparent triangles have just enough alpha to reduce the detail of the images behind without completely masking the detail. I also really like how the angle of the triangles matches the angle of the trees. It really ties everything together too. Great background photo here. It's really the fount from which this entire design springs and everything else compliments it. Nice use of color as well. It really brings in an icy winter wonderland feel that you first established with that excellent background photo. Your typeface selection is working too. The two sans-serifs seem to be cooperating nicely.
I don't know that your bodycopy necessarily needs to be that bold. I wonder what it'd look like if it was a little lighter weight.
Your second design has a beautiful starry night feeling with vague mysterious undertones. I think it's the green glow in your footer that gives it a slightly spooky feel. Once again you've chosen an excellent photo. It's dark, and colorful, and mysterious, and it immediately establishes a tone that you roll with and enhance with that glowing footer. I'm glad that you resisted the temptation to add more color and let the background image do most of the talking. The white type shines against it. Good type selection as well. Your fonts are all working well together.
I'd run a gradient mask on the bottom of your background photo so that you don't have a hard edge at the bottom. I'd also add a bit more space between your navigation buttons on your mobile layout. Right now they run together a bit.
Excellent work!
"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
Michael Ganschow-Green - GRC 175 Instructor
mganschow@tmcc.edu | 673-8200 ext.5-2173
Re: Project 1 Preliminary
Hi Jordi,
I love both of your designs! The first design is very calming because of the blue hues. My only suggestion for the first design is create more contrast and hierarchy with your text because it all looks the same right now. You accomplished this with your second rough. So take a look at that and try incorporating that into your first rough.
I love both of your designs! The first design is very calming because of the blue hues. My only suggestion for the first design is create more contrast and hierarchy with your text because it all looks the same right now. You accomplished this with your second rough. So take a look at that and try incorporating that into your first rough.
Kassandra Fuentes