Week 16A

Today in class we presented our micropage that we completed. In our presentation we had to talk about the subject of our web page, reasons behind our design and how we problem solved through the development process. It was important to talk about how we problem solved but it was hard to stray away what we got frustrated on. Some of the points I talked about that were difficult for me to decide in my decision making process were layout, placement and small coding issues. I kept a two column design through out my design and placed imagery according to the content. I really wanted to focus in my design was keeping my playful theme and challenge myself to create depth in my web page.

After our presentations we received feedback from our professor and classmates. Overall all the classmates really like my design and thought everything was working. As for my professor, he gave me some critiques that I definitely agree on and will apply them. Some of the things that I should look into fixing are making my lines that break up content thinner. Retouch on the donation and back to top buttons to make sure that they reflect the same theme as the other illustrator imagery. By doing this it will reflect on our readings on "Signal and Cue".

Week 15- Outside of Class

Final Project:

Goal:

The goal of this project is to create a single webpage design that uses our design and coding skills to re-create a page from our kick starter campaigns. The campaign I choose was the "Splash Infusers". This is a 2-piece design that allows your to choose your favorite flavors and ingredients and mash them into the infuser followed by dropping the infuser into your favorite beverage or drink of choice. Once placed into your beverage the splash infuser instant releases those flavors into your drink and creates an overall better and healthy beverage.

Logo:

As you can see Splash Infusers already has a logo. So I redesigned one with a more playful and bubbly typeface. The typeface I choose was Barber. I also added customize fruit that I vectorized from photos off the internet. I didn't want to copy anything that I found off the Splash Infusers page except for the content. The other typeface that I used was open sans off google fonts because the typeface was easy to read off of my opacity background and that is why I stuck with that typeface. I also had some issues with the @font_face typefaces and no matter what I tried it wouldn't link.

                                  

Theme/Colors/Photography:

For my micropage I wanted to keep the fun and playful theme off of the kick starter campaign. But for the most part all of my colors and tones are original as well as all the imagery that was used in my page. 

Final Design:

Week 15B

In Class: 

This was our final work day and I worked on more of my imagery that i'm going to use for my website. I changed the colors of the icons for the benefits and decided to display them in a two column system to best flow with the rest of my design. I also worked on creating a donation link that would bring you to the Splash Infusers kick starter campaign. 

Week 15A

Here is what I worked on in class and outside of class.

Week 14-Outside of Class

Over the weekend I worked more on my Splash infusers micro-page. I'm starting to create a five column grid system. Trying to decided how I wanted my layout to look, took a lot of trial and error on the screen. I work better trying to move boxes around on the screen than re-drawing the concept over and over again, because when I draw I think way to big and can never accomplish what I want on screen. 

IIDC Event 

Responsibilities:

Web Team

- Created the montage of photos on the about us page.

-Choose all the photos for the montage image

-Helped placed code for new website

Speaker's Team

-Introduced and welcomed Melissa Zane on day of event

Extra Help

-Helped guided people to where they needed to be

-Brought extra waters for speakers

-Brought back up laptop

-Helped clean up by moving microphones, chairs and pick up trash 

About the Event:

For the second year in a row the design students put on the Interdisciplinary Interactive Design Conference. We mostly had students come and listen in on the event but surprisingly a lot of outside clients and designers came to here what the four chosen speakers had to say. Each of the speakers brought something new that everyone could reflect on even if they weren’t in the same field or design concentration. The first speaker was Melissa Zane and she is the Director of Creative Services at Godfrey. Her company is a business-to-business brand that unifies the methodology of design. She talked about the process of design branding and how to think about forward strategy. The second speaker was Kent Eisenhuth. He had a lot to talk about designing touch points and how software designers need to think in the same way designers do. He focused more about the design and how the UX can affect the users. The next speaker was Teresa Van Wagner and I honestly got a little lost when she was speaking because she didn’t explain the term building perception to the fullest because that was what her presentation was all about. The last speaker was very inspirational because Vinny was a data scientist. As designers we forget about how important date and finding data quickly is to us. He talked about how interactive design can help the value of user experience when searching information on a website. Overall I took a lot from the event and feel that having different professions gave a lot of incite about how many options you have in the design world and your not stuck in one area because they are all related to one another.

Week 14B

No Class- Holiday Break

Week 14A

Today in class we worked on our micro-page more. When I talked to our professor he gave me some advice to change the background so it fits the width of the screen and to change around my text colors. Most importantly we talked about keeping my design within the grid system. So I have to go back and look at my layouts and organizing the information better. I think I like the last ideation of color with my title the best because it pops and catches your eye. 

Week 13- Outside of Class

For homework over the weekend we created a typecast layout of what our text would look like on our micropage. The typefaces I choose are Neue Helvetica for my body copy, text, and h3. As for my quote(h2) and h1 title it a typeface called Barber. I tried to make this typeface a little more fun to go with my theme. 

Also for homework we need to get 25% of our micro-page done. I worked a lot of time on making my hero image and as well as my background splatter. I had 

Here is my inspiration from my hero image.

Reading:

7 Rules for Creating Gorgeous UI (medium.com)

The writer says that he has become good at UI through analyzing what works, it didnt come to him inherently. Deliberate practice is going to improve your skill.The most important non-obvious thing to learn about UI design: light comes from the sky.Its natural for things to be lit at the top, shadowed at the bottom. Otherwise it looks unsettling. Even though our screens are flat, a lot of design goes into making things look 3-D. There is an example about buttons that is great!

There are certain elements that are usually inset, and others that are typically outset.
Erik says that flat design is not going to be a long-term trend, because the subtle simulation of 3D is far too natural to give it up entirely. It will become semi-flat design. What he does see sticking around is Google's material design, dealing with shadows to convey depth.

Key word: subtle.
Starting with black and white forces you to figure out the harder problem first, making the app beautiful and usable in every way without the aid of color. Add color last, and even then, only with purpose. Having too many colors can hurt you. Most apps are clean and simple.For color schemes: never use black, adobe color cc, dribble search by color.
Double your Whitespace. You need a lot of breathing room for good UI. Think about margins and spacing right from the beginning. Put space between your lines, elements, and groups of elements.

Week 13B

In Class we started to create the structure of our html and css page for our kick starter campaign. The hardest part about this design was getting my overlapping (blue) box to stay on top of all the other boxes because my goal is to create a sense of depth in this part of my design. 

Also in class we went over what our jobs are for the IIDC conference on Saturday. The extra things that I need to bring is a back up computer and 4 water bottles for the speakers. We also went over what we are speaking before the speakers. I had to change my speech a little bit because the wording was a little off and I had too much information. 

(Speech) 

Hello Everyone, 

Our first speaker today is Melissa Zane. She joined Godfrey in 1996 as a designer. She is now the Vice President and Director of Creative Services at Godfrey. In Melissa's road to success she balances a passion for learning with her ability to see a vision and carry it through. By, constantly drawing on her previous experience and strong creative background. 

Thank you and lets give a warm welcome to Melissa Zane. 

Week 13 A

Here are my new designs for my kick starter campaign. I focused on where exactly the content would be placed and try to stay with a grid system. This was kind of difficult to do because my kick starter campaign had so much content to choose from, which made it difficult to decide where I want the most important information to be place. I'm kind leaning to my second drawing but more of the layout of the recipes in the 3rd sketch. 

1.) 

2. ) 

3. )