HomeОбразованиеRelated VideosMore From: Jesse Showalter

5 - Design & Code a Responsive Landing Page from Start to Finish | Visual Design Part 2 - High-Res

319 ratings | 8843 views
Visual design is what we are all waiting for as designers, and the time has come to take everything that we have done and create something that actually looks like a website. In this video, we create the desktop and mobile view of our project that we will export assets and handoff for development. Remember to Subscribe https://goo.gl/6vCw64 I cut the visual design process into 2 parts because each of them is very comprehensive processes and combining them can feel a bit overwhelming. I had over 1.5 hours of footage for this video and used a lot of fast forward to make it digestible, If you have questions about the process please feel free to tweet me or comment below. http://twitter.com/iamjesseshow 1. Intro - https://youtu.be/sr6jDeAoXCc 2. Discovery - https://youtu.be/g2aSWqU0gqA 3. Wireframe & Moodboard - https://youtu.be/boF058Bh5lo 4. Visual Design Part 1 - https://youtu.be/3xWViyhRGd4 5. Visual Design Part 2 - https://youtu.be/HqykJljlN2A 6. Setting up the Dev environment - https://youtu.be/cXbRAdPXpRA 7. Coding the Nav and Header - https://youtu.be/Boc_IZNzlh4 8. Coding the brand and feature section - https://youtu.be/O4gqpgRvYJg 9. Coding the Offer Section - https://youtu.be/JsLeiFbi8RM 10. Coding the Download Section - https://youtu.be/jMkAeo2uGHk ------------------------------------------------------------------------------------ This series is all about the web design and development process from start to finish. I am going to be taking you through the entire creative process from sketching and wireframing to high res mockups and full development phase. I have never done a series this large, and my hope is that you will grow as a designer and developer not because I am perfect but because you have allowed yourself to stumble and fail with me on the road to making something you can be proud of. I made this series because I believe that by teaching it I will learn and grow from not only the experience of creating the project but getting feedback from you all. ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - If you want to support the content I make and buy me a cup of coffee https://www.buymeacoffee.com/jesseshowalter ////////// Social Twitter: http://twitter.com/iamjesseshow Anchor: https://anchor.fm/iamjesseshow Instagram: https://www.instagram.com/iamjesseshow Medium: https://medium.com/@iamjesseshow - ////////// Equiptment Vlogging Camera - Panasonic G85 http://amzn.to/2EwumHn - Drone- DJI Spark http://amzn.to/2CpodH9QV
Html code for embedding videos on your blog
Text Comments (45)
TheClrr (2 months ago)
nice man! thak you
Jesse Showalter (2 months ago)
Your so welcome
Jonathan Cunanan (4 months ago)
Thank you for showing your design processes!
Jesse Showalter (4 months ago)
You are so welcome
Elliot Jay (4 months ago)
You're a boss
Jesse Showalter (4 months ago)
Thanks Elliot
Nguyen Nha (6 months ago)
Thanks man !
Bond Burton (6 months ago)
Good job Jesse
flwei4 (7 months ago)
Hey Jesse ! I'm a young graphic designer (speciliazed in print for the moment), and this year I start a training in UX design (if you know the "Gobelins" school in France). I kind of find a bit the creative methodology that i learned and apply in my print projects, it helps me create some links with UI/UX design. Your series helps me a lot to learn how it's working, i'm taking notes like it would be a real lesson x) Also i'm french, and i clearly understand your explanations, you speak in a very fluid way ! (and if needed i activate subtitles for importants parts haha) Love your work, wish you the best Florian
Ioannnify (7 months ago)
Thanks Jesse for sharing your design process with us. You are really helping us!
Ahmed Mohammed (9 months ago)
it's so fun learning from you, Jesse :)
Jesse Showalter (9 months ago)
It’s so fun to hear all of the positive feedback, so glad to be a help🤘🏻
Jonathan Tso (9 months ago)
Amazing series Jesse, really helpful ! Recommended your channel to tons of friends. Keep on the great work
Jesse Showalter (9 months ago)
So cool! Thanks so much for your support.
Rita Agafonova (9 months ago)
I’m currently working with my first web design/dev client. This series is very helpful
MJay Gurav (9 months ago)
Hi jesse, I've a question- Are there any tools such as sketch for Windows..?
Jesse Showalter (9 months ago)
Adobe XD, Figma 👍🏼
sc (9 months ago)
Adobe XD or you can use browser based prototyping tool like Figma (free up to 3 members, 3 project)
Finn Brennan (9 months ago)
so much value offered to the community, especially to those just coming into it like myself. design + code how to's are extremely helpful!
Jesse Showalter (9 months ago)
Thanks for the encouragement, excited that the series is a benefit 👍🏼
rahal razika (9 months ago)
creat job i want to ask you how to be creative in photoshop.
rahal razika (9 months ago)
thank you very much u'r awsome
Jesse Showalter (9 months ago)
That's a loaded question, work hard, make lots of stuff, get critique. Evaluate -> Execute -> Repeat 👍🏼
Angela (9 months ago)
I love how you’re going to include the coding process. I don’t see content like this a lot anywhere else. Awesome job 👍
Jesse Showalter (9 months ago)
Thanks, I am excited for it
Eddie Colon (9 months ago)
Jesse, i do my mock up now in photoshop, if you were me would u switch to sketch for the mockup designing piece ?
Eddie Colon (9 months ago)
Jesse Showalter I switched two days ago woo
Jesse Showalter (9 months ago)
I would because I love Sketch so much, but it really depends on what you want. There's always a learning curve to switching platforms but I got your back 👍🏼
Luxus Häuser (9 months ago)
Nice video. We've only just done this in Modx and you may recognise the hallmark of the designer. What do you think Jesse: luxus-hauser.com
Luxus Häuser (9 months ago)
Thanks for taking the time to provide those comments.
Luxus Häuser (9 months ago)
Thanks for the feedback, we will pass the comments on to our Modx developer.
Jesse Showalter (9 months ago)
Overall I think it's nice but it lacks the panache of a custom designed site. Think about adding some customization to the layout that will make it go "wow". If it's a luxury brand I would recommend looking at some luxury watche websites to get inspiration. 👍🏼nice work
Allan Gomes (9 months ago)
I'm not Jesse, but can I give you my fast opinion about it as a problem-solver through design and usability? So, I think that the website is a bit boring. Too much text and too little personality, also a lot of unnecessary blank spaces on some parts and not so much on others. Given the context of the website and it's users I would do a fancier and more sophisticated Design, also giving a sort of comfort to the user. Another problem is that the nav bar is taking too much space at the scrolling. I can give you more detailed review or help you with something, you can find me at [email protected] I'd be a pleasure.
Jacob Boutrup (9 months ago)
Really nice!
Just Irma (9 months ago)
Nice series - Awesome way to get comfortable with design principles.
Jesse Showalter (9 months ago)
Cool! That was my hope for series so I really appreciate the comment 🙈
Jon Persson (9 months ago)
Really enjoying this series, Jesse. Super cool to see how other designers & developers work, what their process is like, and how + why they make certain design decisions.
Jesse Showalter (9 months ago)
Thanks for the support 👍🏼
Nemo Sampaio (9 months ago)
Very good series of videos, really cool!
Jesse Showalter (9 months ago)
Thanks so much
Driss oud (9 months ago)
I really love this series because I believe in learning by making real projects and I'm so excited to coding part. Thank you so much for teaching us! 👍👍
Jesse Showalter (9 months ago)
They will start coming faster now, thanks for being patient.
Kubek IT Technology (9 months ago)
In my opinion the menu has too little contrast. It might be a problem in wave aria. But still is nice project!
Jesse Showalter (9 months ago)
Thanks for the feedback 👍🏼
Jesse Showalter (9 months ago)
Visual Design A.K.A. "the fun stuff!" is so much easier when you have put in the time and walked through the process. Thanks for following along with the series and hope you can all make the Live Q&A on Thursday April 5th at 10am PST. I will be answering your questions regarding the series as well as answering random rapid-fire questions 👍🏼https://www.youtube.com/watch?v=XDQ2sCxpp98

Would you like to comment?

Join YouTube for a free account, or sign in if you are already a member.