Piggy backing off of the design of "Day 1 post - sign up page"
Day 2 -
Credit Card Checkout
Hint: Design a credit card checkout form or page. Don't forget the important elements such as the numbers, dates, security numbers, etc.
webdesign
Adventures with Html Email Coding!
in Web
Html email coding= kind of a bitch. What seems like such a simple task.... actually made me want to rip my hair out. Luckily, I am not the only one that feels this way. A web developer friend sent me an article from A List Apart "Can Email Be Responsive?" after I had vented my frustrations. I'd personally like to quote:
"Still, email design is an outrageously outdated practice. Remember coding before web standards became… standards? Welcome to the living hell of email design."
Things I learned:
- Do not use JSBIN for coding this. (In a previous class "Coding for Designers" we had used JSBIN, I assume for novice purposes)
- Difficult to find solid tutorials that aren't completely outdated.
- See how the code looks in html, test in Litmus email testing program, note that it does not look the same, google issues, fix code, look in html, test in Litmus email testing program, note that it does not look the same, fix code, lather, rinse, repeat.
- Patience with email coding and knowing there are talented people trying to make updated best practices.
- And holy crap, how did I finally get that to look decent?!
Mock up for my html email coding project.
Screen Shot of how it looks in my Chrome browser
And finally, screenshot of how it looks in my gmail after litmus test.
Unfortunately, It is not as beautiful yet in mobile. Just patting myself on the back for having gotten this far!
Still Learning/Always Learning!
Woo! I have had so much logo design work lately.. It's taken over! but happy to share, always continuing to learn and beef up skills...
Definitely needed more direction as far as learning UX design, luckily had a fantastic class with Aquent to get down and dirty. Do I like design better? DUH! However, I completely benefited from this class by learning the backbone and muscles to what makes the final design possible
Edits and Moving forward. UX, UI, Web Design
So far I have been thinking simple, I've created some sketches.
home page based on site map.
About page based on site map
reservation page based on site map.
BRAKE SCREECH! STOP. So though these I feel are properly drawn. There has been a misstep here. Yes, these are laid out nicely, but I've moved away from thinking about the user. So far my "vision" was critiqued by Tony (the front end developer) and it's gone in the wrong direction. Things to think about, especially for a restaurant website, what is the most important thing a restaurant has? What is the key player in all of this? What does a user want to know first and foremost when checking out a restaurant website?! The menu! At first I was researching and gathering inspiration for multiple page layouts. I found fantastic examples, but the best decision and practice is to think about a one page layout. We are thinking simple, so really this is the most beneficial way to present this specific website.
Back to the drawing board, research, inspiration. I checked out the usual suspects, Google, Pinterest (check out my web inspiration board), and a glorious website OnePageLove which offered fantastic restaurant one page layout examples. A few to mention, Rosebud Kitchen, Pitch Bar and Eatery and The Bancroft, were definitely my favorites. I felt these websites were in the correct direction to move towards for the best user experience.
Wireframe sketch based on new revelations.
I'm feeling this is simple, yet will translate well responsively, effectively using the one page format. Stay tuned for more details.