Home
Videos uploaded by user “Jesse Showalter”
UX Crash Course | Getting Started in User Experience Design
 
09:37
User experience design (UX, UXD) is the process of enhancing user satisfaction with a product by improving the usability, accessibility, and pleasure provided in the interaction with the product. Remember to Subscribe https://goo.gl/6vCw64 What is UX Design //////////////////// At the core of UX is ensuring that users find value in what you are providing to them. There is lot’s of discussion on what the main purpose is of UX but I’ve always gone with the big 7 What does a UX designer do? //////////////////// Useful: Your content should be original and fulfill a need Usable: The Product must be easy to use Desirable: Image, identity, brand, and other design elements are used to evoke emotion and appreciation Learnable: Content needs to be navigable and simple enough to be learned by the user while they are using it Memorable The user should be able to return to the product without having to relearn it Accessible: Content needs to be accessible to people with disabilities Credible: Users must trust and believe what you tell them What Do UX Designers Do? //////////////////// 1. Wireframes 2. User Research 3. Copywriting 4. User Personas 5. User Testing Helpful information on UX design //////////////////// https://uxdesign.cc/ https://generalassemb.ly/design/user-experience-designhttps://theblog.adobe.com/what-does-a-ux-designer-actually-do/ https://www.invisionapp.com/blog/become-ux-designer/ https://blog.nicolesaidy.com/7-steps-to-become-a-ui-ux-designer-8beed7639a95 https://careerfoundry.com/en/blog/ux-design/what-does-a-ux-designer-actually-do/ https://uxplanet.org/how-to-get-started-in-ux-ui-design-ae097cc0d1c ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// 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 https://www.amazon.com/shop/jesseshowaltertv
Views: 42044 Jesse Showalter
Web Design vs Web Development | What's right for you?
 
09:52
If you are thinking of pursuing a career as a web designer or web developer then this video is for you. It can be hard to know where to start and which road is the right one for you to travel down. Although there are some inherent similarities between the two roles they are very different in nature. One is focused on aesthetics and usability, the other is focused on code and functionality. LIKE FREE STUFF? //////////// If you're interested in my thoughts and experience on the topic download my free ebook called "Make Your Portfolio Count" http://eepurl.com/djC53b To help clear things up a bit, in this video I'm going to cover the roles, tools, and expectations of day to day life for both jobs. At the end, I share a few opinions on which is right for you to pursue. ------------------------------------------------------------------------------------ If you want to support the content I make and buy me a cup of coffee https://www.buymeacoffee.com/jesseshowalter ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2rdVncw - Drone- DJI Phantom P3-STANDARD Quadcopter Drone with 2.7K HD Video Camera http://amzn.to/2n5iSQV
Views: 147101 Jesse Showalter
UX Design vs UI Design | What's the Difference? Which one is right for me?
 
15:36
If you are thinking of pursuing a career as a UI Designer or UX Designer then this video is for you. It can be hard to know where to start and which road is the right one for you to travel down. Although there are some inherent similarities between the two roles they are very different in nature. ////////// Join Makers & Shakers Creative Community https://www.makersandshakers.io ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Like What I Do, Buy Me a Coffee https://www.buymeacoffee.com/jesseshowalter ////////// My Awesome Music is from Musicbed http://share.mscbd.fm/iamjesseshow To help clear things up a bit, in this video I'm going to cover the roles, tools, and expectations of day to day life for both jobs. At the end, I share a few opinions on which is right for you to pursue. In a nutshell, UX design makes websites functional and UI design makes websites beautiful. UX design, short for user experience design, is a very analytical process that is heavily based on research to find out how to design a a product in a way that it solves the customer's problem(s). UX Design Learning Links: https://uxdesign.cc/ https://www.smashingmagazine.com/category/uxdesign/ https://www.uxpin.com/knowledge.html http://uxmag.com/ https://www.nngroup.com/ http://www.uxbooth.com/ UI design, short for user interface design, support the UX design visually through colors, fonts, icons and graphics. UI Design Learning Links: https://designcode.io/ http://trydesignlab.com/ https://teamtreehouse.com/library/mobile-app-design-for-ios https://www.udemy.com/ui-web-design-using-adobe-illustrator-2017/ http://learnui.design/ If you want to support the content I make and buy me a cup of coffee https://www.buymeacoffee.com/jesseshowalter ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 178959 Jesse Showalter
How to Wireframe a Website or App | Web Design & App Design Tutorial
 
07:52
Today we're talking about Wire-Framing for the web design and product designer process. If you have never wire-framed a website before, I would recommend stopping what you're doing and getting a paper and pen to follow along. It’s the first part of any web design or app design process and will really help you design the structure of a site or app based on the content. Remember to Subscribe https://goo.gl/6vCw64 🤘 In this video I cover some the things you will need before you start sketching ideas out, the process I go through, and some tips on how to create a visual wire-framing style that works for you to make your projects flow smoothly. ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 31584 Jesse Showalter
5 Essential Sketch App Tips • Sketch for Mac Design Tutorial  • Design, Process, & Workflow
 
06:59
Today I want to share a few of my favorite little tricks I end up using every day. while designing interfaces and graphics in Sketch for Mac. https://www.sketchapp.com/ All of the following 5 tricks do not require plugins, they all come out of the box in the current version of sketch which as of this video is Sketch 42 (awesome version FYI) 1. Inner Shadow Line All of those are fine and dandy but Sketch's easy access to an “inner shadows” allows me to create table cells and separation of elements in seconds and the best part is I can then butt elements right up to each other and not worry about what layer is in from or beneath. 2. Reduce File Size One of the ways you can remedy this issue is to use Sketch’s built-in ability to “reduce the file size” by searching for all those high res photos and downsampling them to fit your project. Don’t worry you won’t even be able to tell except for the alert that tells you what a good boy or girl you are and how much space you saved today. 3. Drag Images Into The Fill Panel Seriously though, 9 times out of 10 these days I use this trick to place images into my project. Simply draw a shape and switch its fill to an image, but no need to click and search your computer for that image. If you are prepared like a Boy Scout, have the file open in your finder and just drag it into the image thumbnail and bam! perfectly sized photo element in your project. Take it one step further by not even having to pull images from your computer but straight from the web… I know cool right? 4. Use Command, to Find The Center Between Two Points When editing vector shapes sometimes you need to add more points and a common need for me is to add a point directly in between 2 others. Don’t eyeball that! just hold the ⌘ key and hover over the edge of the shape and it will lock onto the exact center. 5. Nesting Symbols I just cannot say enough how much I love this feature. Bohemian Coding has really spent the time listening to the modern design community and built something that makes life as a designer better. Isn’t that the point of software? The perfect example of this commitment to improving lives is Sketch’s ability to Nest Symbols inside of other Symbols to make amazing magic happen. ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 25051 Jesse Showalter
Top 10 Sketch Plugins to Improve your Design Workflow | Sketch for Mac Tutorial
 
06:03
Sketch for Mac is my go-to tool for UI design, UX design, and any other form of digital design that I do. One of the best parts of Sketch for Mac is the ability to customize how you use Sketch with plugins. Remember to Subscribe https://goo.gl/6vCw64 As designers, we are constantly experimenting with tools and processes in an attempt to find the one that works best. Here are my top 10 plugins I use every day that help me improve my workflow and productivity while I am designing. ////// Sketch for Mac https://www.sketchapp.com/ ////// Top 10 Plugins https://sketchrunner.com/ https://designcode.io/angle https://imageoptim.com/sketch https://github.com/oodesign/merge-duplicate-symbols https://rodi01.github.io/RenameIt/ http://utom.design/measure/ https://github.com/andrewfiorillo/sketch-palettes https://uxuiland.com/sketch/spell-check-whole-page-sketch-plugin https://github.com/sonburn/symbol-organizer https://www.invisionapp.com/craft //////// Other awesome sketch plugins https://sketchapp.com/extensions/plugins/ ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// 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 https://www.amazon.com/shop/jesseshowaltertv
Views: 12328 Jesse Showalter
Intro to Sketch - Beginners guide to Sketch Basics |
 
15:32
Sketch for Mac one of my favorite digital design software of all time. If you're just starting out with Sketch or debating on whether you should make the switch this tutorial is for you. LIKE FREE STUFF? //////////// If you're interested in my thoughts and experience on the topic download my free ebook called "Make Your Portfolio Count" http://eepurl.com/djC53b Remember to Subscribe https://goo.gl/6vCw64 I have been using Sketch for over 2 years full time in my design work and I realized I have never done a basic intro to Sketch that covers all the topics a beginner would need to understand the Sketch basics. So here it is Sketch for Beginners... a sort of 101 class so to speak. In this video, I cover all the basics you would need to know you start using Sketch for Mac today in your professional design work. By the time you're done watching the video, you should be able to download the program, install, start making amazing things, and wonder why you ever waited to make the switch.If you are still using something like Adobe Photoshop for digital design it's time for you to experience something better. In this video I cover: - Benefits to using Sketch - Brief tour of the UI - Artboards - Setting up a grid - Working responsive - Pages vs Artboards - Adding Shapes - Details panel - Setting up text styles - Using symbols - Alignment, Measure & Adjustment tools - Plugins - Exporting I know it sounds like a lot but stick with me and hopefully, you'll learn everything you need to know to starting making amazing designs in Sketch. My Favorite Sketch Plugins: http://sketchrunner.com/ https://www.invisionapp.com/craft https://github.com/thierryc/Sketch-Find-And-Replace https://medium.com/sketch-app-sources/merge-duplicate-symbols-in-sketch-24772e9b7f0 https://rodi01.github.io/RenameIt/ https://github.com/utom/sketch-measure https://github.com/andrewfiorillo/sketch-palettes https://github.com/Tallwave/sketch-spellcheck-all-layers https://github.com/sonburn/symbol-organizer ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 118541 Jesse Showalter
5 UX Design Tips & Techniques | UX Design Basics
 
06:22
UX design is a highly sought-after skill these days, and for good reason, a UX designer focuses on making products more effective to it's users... But there's not always a dedicated UX Designer on the team, in the budget, or in the scope of work. Today's video is focused on 5 UX Design techniques you can apply right now in your projects as a designer that will take you a long way. Remember to Subscribe https://goo.gl/6vCw64 UX Design Definition: User experience design (UX, UXD, UED or XD) is the process of enhancing user satisfaction with a product by improving the usability, accessibility, and pleasure provided in the interaction with the product. User experience design encompasses traditional human-computer interaction (HCI) design and extends it by addressing all aspects of a product or service as perceived by users. UX Design resources: http://uxmag.com/ https://www.smashingmagazine.com/category/user-experience https://www.awwwards.com/ http://uxmovement.com/ https://designmodo.com/design/ux-design/ http://www.uxbooth.com/ ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// 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 https://www.amazon.com/shop/jesseshowaltertv
Views: 8278 Jesse Showalter
Simple Parallax Scrolling in 3 minutes with Stellar.js
 
03:12
In this tutorial I will show you how to add simple background parallax scrolling in 3 minutes or so using stellar.js simple plugin. Code for the static site can be downloaded here: http://jesseshowalter.com/assets/uploads/code/stellar.zip
Views: 28933 Jesse Showalter
Top 5 Web Design Mistakes | Design Mistakes I Have Made A Lot
 
08:35
In today’s video I talk about the top five most common mistakes made when designing a website. Designing websites is hard, and takes a lot of practice to get it right. If you’re anything like me you’ve made plenty of mistakes while designing websites. I think it’s important to Point out common mistakes so we can transition those mistakes into success. In the video I talk about common mistakes, show examples of what I’m talking about, and propose some remedies for those mistakes. Remember to Subscribe https://goo.gl/6vCw64 Top five web design mistakes: 1. Poor readability and legibility 2. Messy content layout 3. Bad navigation 4. Inconsistent Design 5. Too many animations ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 19829 Jesse Showalter
Organizing Symbols in Sketch for Mac | Sketch Design Tutorial
 
11:49
In today's design tutorial, I talk a little bit about how I organize my Sketch Symbol Library. While this may not seem like the sexiest topic it can actually be a pretty amazing thing to open up your design file and have everything setup and ready to go in it place. Remember to Subscribe https://goo.gl/6vCw64 The opposite of awesome is opening your file and having extra symbols, duplicate symbols, messy art boards, and just plain confusion...Not Cool :( So I cover the 3 things you gotta do to organize your project and by doing so enjoy your life a little bit more. 1. Understand how symbols work 2. Name and Categorize your symbols 3. Use plugins to clean up the mess and set your OCD at ease Merge Duplicates https://github.com/oodesign/merge-duplicate-symbols Symbol Organizer https://github.com/sonburn/symbol-organizer Sort your layers panel https://github.com/romashamin/sort-me-sketch Designer featured in the video: https://dribbble.com/ayushjangra ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 16073 Jesse Showalter
Full Stack Designer... What's that?
 
06:18
What on earth is a full stack designer? Maybe you have heard the term full-stack developer, but what is a stack and how does it apply to designers? Remember to Subscribe https://goo.gl/6vCw64 Turns out there is such a thing as a full stack designer and it turns out I am one of them. It's really just a term that represents a multi-faceted designer with experience in a breadth of disciplines. The benefit to a Full Stack Designer is that they can look at a project more holistically because they are thinking about the project from end to end. This does not mean that they do every single aspect of a project form logo to databases, but it does mean that they have a broad spectrum that they work in. Full Stack Designers are in demand right now for teams, projects and clients that need people to wear multiple hats, true there are a lot of opportunities to work in a more siloed scenario, but if you like change, challenges and pancakes than this style of work might be for you 😆 ////// Interesting Links Huge Credit to Ran Segall for his Blog Article that helped me understand this is who I am and inspired the video: 👇🏼 https://www.slideshare.net/RanSegall/the-full-stack-deisgner-manifesto https://medium.freecodecamp.org/what-is-a-full-stack-designer-in-2017-will-you-be-one-a309e39ba094 https://medium.com/@edenvidal/the-rise-of-the-full-stack-designer-and-the-tools-he-uses-3daf015eb3fc https://uxdesign.cc/why-i-believe-in-full-stack-designers-a4a154f6bac2 ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 7023 Jesse Showalter
Affinity Photo Top 10 Basic Tasks - Affinity Photo For Beginners
 
21:11
Affinity Photo is an amazing photo editor for mac and windows. It's full-featured, powerful and friendly to beginners. In this design tutorial, I show you the 10 most common basic tasks you might want to do inside Affinity photo. Remember to Subscribe https://goo.gl/6vCw64 If you are just starting out with Affinity Photo or Photo Editing Software, in General, this tutorial should get you up and running. 1) Opening images 2) Cropping images 3) How to remove something from a photo 4) How to remove basic acne and skin blemishes 5) How to use adjustment layers 6) How to use masks 7) Selecting objects in an image 8) Basic Compositing 9) How to add & manipulate text 10) Saving Layered files and exporting final images Affinity Photo offers some pretty fantastic features for photo editing and I highly suggest you check it out of you have been a Photoshop user for a while and are looking for a cheaper alternative. I did a full review of the software here is you are interested. https://youtu.be/1HhvRjZg8F8 Other Affinity Tutorials: Advanced Skin Retouching - https://youtu.be/5FlJbe98Oc8 Masking Images in Text - https://youtu.be/VP0Tw-pVHRY Change Eye Color - https://youtu.be/vCPiqyoy2jc If you want to support the content I make and buy me a cup of coffee https://www.buymeacoffee.com/jesseshowalter ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 91187 Jesse Showalter
Front-end Development vs Back-end Development
 
09:54
Front-end development vs back-end development... what's the difference? Web Development is about building websites and applications. It's not about the design, but about the functionality, but there is a difference between these two sides of the coin, let's take a look. Remember to Subscribe https://goo.gl/6vCw64 In this video, I talk about the key differences between front-end and back-end. - Definitions - Coding Languages - Responsibilities - Where to learn - How much will you get paid - Which is the right one for you The Front-End Development is the part that users interact with. Everything that you see when you're navigating around the Internet, from fonts and colors to dropdown menus and sliders, is a combo of HTML, CSS, and JavaScript is controlled by your computer's browser. The Back-End consists of a server, an application, and a database. A back-end developer builds and maintains the technology that powers those components which, together, enable the user-facing side of the website to even exist in the first place. Helpful Links /////////////////////////////////////////////// Where to learn Front-end development: - https://learn.shayhowe.com/ - https://www.freecodecamp.org/ - https://teamtreehouse.com/tracks/front-end-web-development - https://www.youtube.com/watch?v=9VnjAQTUf5k - https://www.udemy.com/learn-front-end-development/ - https://www.pluralsight.com/ - https://www.codecademy.com/ Where to learn Back-end development - https://devmountain.com/ - https://www.pluralsight.com/ - https://www.codecademy.com/ - https://www.freecodecamp.org/ - https://teamtreehouse.com/tracks/front-end-web-development - https://www.thinkful.com/ - https://generalassemb.ly/ ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 5109 Jesse Showalter
CodeKit Basics - How to Setup a Project & Pre Process CSS
 
08:37
In this video, I talk about one of my favorite tools for front-end development. Codekit it’s a great app to help you compile your code preprocess your CSS, optimize your website and so much more. If you’re developing a website and you want to use a modern workflow, code kit might be the right solution for you. It allows you to get your project up and running in seconds and custom tailor it to your liking. In this video, I cover just the basics of getting started. Where to download it, how to set up your project, how to preprocess your CSS, and how to compile multiple JavaScript files into one main file. Remember to Subscribe https://goo.gl/6vCw64 ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 6991 Jesse Showalter
Front-End Development, HTML & CSS, Javascript & jQuery by Jon Duckett | Book Review
 
05:56
Front End Development Book Review | HTML & CSS and JavaScript & JQuery by Jon Duckett. Learning is so important and although there is an abundance of online learning platforms for front-end development, a good book about HTML, CSS, and JavaScript may just be what the doctor ordered. I bought these book years ago and I have to say it’s refreshing to see a book about programming and code that is written by a human for actual humans. It’s billed as Don't forget to subscribe https://goo.gl/6vCw64 👍 HTML & CSS - http://amzn.to/2rTJuH7 JavaScript & JQuery - http://amzn.to/2slKsxk “A book about code that doesn't read like a 1980s VCR manual... It's not just for programmers, it's written and presented to make it easy for designers, bloggers, content and e-commerce managers, marketers to learn about the code used to write web pages…” I agree with that statement. If you are new to Front-End Development, code, website creation, JavaScript, Or have added scripts to your web page but want a better idea of how they work? Then this book is for you. -------------------------------------------------------- Website http://www.jesseshowalter.com - Subscribe: https://www.youtube.com/c/JesseShowalterTV - Twitter: http://twitter.com/iamjesseshow Instagram: https://www.instagram.com/iamjesseshow Medium: https://medium.com/@iamjesseshow - Vlogging Camera - Canon EOS M3: http://amzn.to/2hT54bo - Drone- DJI Phantom P3-STANDARD Quadcopter Drone with 2.7K HD Video Camera http://amzn.to/2n5iSQV
Views: 48606 Jesse Showalter
The State of Design Tools in 2018
 
14:15
With so many design tools these days, how do you wade through the waters of technology? Sketch for mac, Figma, Invision studio... which one is the right choice for you. In this video, I cover the most popular design tools for Web design, UI design and Product design in 2018. Remember to Subscribe https://goo.gl/6vCw64 I will also cover some applications that I am looking forward to in 2019 and also address some predictions for where I think Design Software will be heading in the near future. Get ready to nerd out and talk about things like prototyping, mirroring, basic design tools, collaborating, version control, vector editing, libraries, design systems and more... The software I will be discussing in this video are: 1. Sketch for Mac 2. Figma 3. Adobe Experience Design 4. Affinity Designer 5. Framer X 6. Invision Studio I also mention the up and coming Phase ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 5678 Jesse Showalter
Don't Make Me Think | Steve Krug | UX Design Book Review
 
06:22
"Don't Make Me Think" by Steve Krug is one of the first books I read when I was getting into digital design. It helped me move from designing things that just "look nice" to designing things that are usable, useful, memorable and simple to learn and use. Remember to Subscribe https://goo.gl/6vCw64 This book was originally published in 2000, then re-published in 2006 and then again in 2014. What's amazing about Don't Make Me Think is its ability to stand the test of time because it's not talking about trends that change from year to year or technology which changes at the drop of a hat, but about solid foundational truths that have will always be applicable. In the video, I cover what the book is about, what I like and dislike about it and who I think the book is a good fit for (spoiler the answer is everybody). Link to the book - http://amzn.to/2xRqudu Other UX Books that I like http://amzn.to/2xRqudu The Design of Everyday Things - http://amzn.to/2yH7DBc Hooked: How to Build Habit-Forming Products - http://amzn.to/2Ex5MX1 ------------------------------------------------------------------------------------ ////////// 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
Views: 7625 Jesse Showalter
How to Learn Design | How to Get Started in Design - Episode 1
 
13:16
Welcome to part 1 of a 5 part series about getting started as a designer. In this video, we cover learning design. Since there are so many facets of design I focus on 5 tips on what to learn and how to learn more effectively. Remember to Subscribe https://goo.gl/6vCw64 This series is geared towards people who have an interest in becoming professional designers but don’t know where to start. In this series, I’ll be covering topics such as: 1. What to Learn 2. Projects to Make 3. Portfolio Building 4. Landing Clients 5. Behavior This series is great if you are interested in design and is not limited to a certain facet of design. Whether you are interested in graphic design, web design, product design, logo design, etc... I cover basic steps that are distilled down in the hopes of helping people make less of the mistakes I made during the process. My goal in making this series is to answer the flood of questions I’ve received by email and twitter asking to get started? What projects to pursue, how to find clients, what to do if you have never had a paying client etc... I really hope you enjoy the series and watch it all the way through. I really tried to answer as many of those foundation questions as I could. ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 44323 Jesse Showalter
How to Mood Board for Web Design | Web Design Tutorial
 
05:59
Mood Boarding is a huge part of the web design process. It allows you to generate ideas about the general aesthetic or "look and feel" of your website projects. Color, typography, patterns, textures, photography are just some of the elements that should be found on your web design moodboard. In this design tutorial, I cover not only How to make a mood board but also what should be on your mood board as well as why you should include this step in your creative process as well as some helpful techniques for the process. Style tile - http://styletil.es ////////// Subscribe Remember to Subscribe https://goo.gl/6vCw64 🤘 ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 10842 Jesse Showalter
Free Design Resources | 2018 | Inspiration, Assets, Typography, Tools
 
06:50
Talking about amazing free resources for graphic designers, web designers and product designers. If you're just starting out in web design and need to know where to go for some good assets, or maybe you're a seasoned graphic or product designer that's in need a shot of inspiration. In this video I cover some of my favorite resources you can find online and the best part is... there all free. Well almost all of them, there are some tools at the end that cost but have free trials. Remember to Subscribe https://goo.gl/6vCw64 🤘 /// Inspiration LAPA - https://www.lapa.ninja/ Hixle - http://www.hixle.co/ // Assets UnDraw - https://undraw.co/illustrations GraphicsFuel - https://www.graphicsfuel.com/ Sketch App Rocks! - http://sketchapp.rocks/ // Typography FontJoy - http://fontjoy.com/ The Kerning Game - http://type.method.ac/ // Photos Burst - https://burst.shopify.com/ Free Photos CC - https://freephotos.cc/ // Tools AND CO - https://www.and.co/ DuoTone - https://duotone.shapefactory.co/ ColorSpace - https://mycolor.space/ ------------------------------------------------------------------------------------ ////////// 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
Views: 9285 Jesse Showalter
Sennheiser PXC 550 Headphones Review
 
06:31
Today I am taking a look at the #Sennheiser PXC 550 over the ear, Bluetooth headphones. I recently got this pair after a lot of research and I wasn't let down. I cover the features, build and quality of these headphones as well as the companion Captune app. Where you can buy the Sennheiser PXC 550 Wireless Headphones: https://amzn.to/2My5hA3 Remember to Subscribe https://goo.gl/6vCw64 I really love these headphones, they are firing on all cylinders for me. I don't think I could live without them now that I have them. ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 9679 Jesse Showalter
How to Mask an Image on Text in Affinity Photo | Graphic Design Tutorial
 
05:00
How to Mask an Image in Text in Affinity Photo. In today's graphic design video tutorial, we show you how to mask an image on text using Affinity Photo by Serif. Remember to Subscribe https://goo.gl/6vCw64 Working With Text Combining an image with text can be a super fun and effective technique. It can create a playful sense of depth and allows for textures, colors, and imagery to make it's way into the design. There are two ways to accomplish this while still keeping the text editable. Layer Masks, and Clipping Masks. They are both really similar and the technique is subtle. Look for the horizontal or vertical lines in the layers panel to give you a hint. Although both techniques are similar I recommend going with the clipping mask since it makes moving the image around after it's masked easier. After we chose our text, we brought our image into Affinity Photo. From there we used a clipping mask to make sure the image was only shown within the text. Let me know if you have any questions about the tutorial or if you have any other fun techniques and or effects with text that you love. ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 5323 Jesse Showalter
Setting Life Goals using Trello | Productivity Hack
 
05:50
I use Trello for a lot of things. Web Design projects, Graphic Design Projects, Front-End Development etc... But Trello can be used for more than just client projects. Remember to Subscribe https://goo.gl/6vCw64 🤘 https://trello.com/ In this video, I show you how I use Trello to set and accomplish bigger life goals. Things that have to do with my marriage, my family, my business, My personal goals of fitness or design, even fun things I want to do. Trello is great for breaking down large goals into smaller more manageable pieces. Everything can be broken down into pieces including your big life goals. The best part about it is this process and Trello itself is free to use. You don't need a fancy bullet journal, an expensive software, or some life coach. You just need a good work ethic, consistency and a free tool like this one. Start making things happen in your life and don't let those big audacious hopes and dreams pass you by. Hope this is helpful to someone out there, but please keep in mind... This works for me, but it may not work for you. Don't get discouraged I am imperfect at best and slip and fail all the time. If you fall off this horse, just try your best to get back on it or something else that will carry you to the end result you desire. https://trello.com/ ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 8821 Jesse Showalter
Working with Developers (5 Tips for Designers) | Design workflow tutorial
 
08:17
Today I share my Top 5 Tips for Designers who are working with developers. Let's face it...Working in teams is hard! Collaborating is hard! Passing your designs off to a developer and having the final product not be all that you hoped it would be is frustrating... But maybe we as designers can take a little of the blame and try to see it from the other side of the coin. Remember to Subscribe https://goo.gl/6vCw64 In this video, I cover the tips that will help you have successful handoffs to your developer or development team. THE GOLDEN RULE: "Consider others as more important than yourself" This golden rule applies to life in general but also applies to designers working with developers. Spend the little bit of extra time valuing their time, their, workflow, their processes, and them as a person and you and the project will be better off for it. 5 Tips to working with developers: 1. Involve developers form start to finish 2. Document your designs excessively 3. When possible prototypes for animations and interactions 4. Be really organized 5. Adapt to their process a little bit I hope that you guys already have amazing experiences when you're collaborating with your dev teams. If you don't maybe try these tips out, and if you do have great experiences try these anyways and see what it does for you. Let me know your thoughts down in the comments 👍🏼 ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 3830 Jesse Showalter
Installing, Setup and Nesting | Starting with Sass
 
06:54
This series is all about getting up and running with the basics os Sass. In today's episode, we will install Sass, get it up and running in our project, and use basic nesting to make our code DRY. Remember to Subscribe https://goo.gl/6vCw64 Sass is the most mature, stable, and powerful professional grade CSS extension language in the world. In this series we will be covering the basics of Sass: Preprocessing Variables Nesting Partials Import Mixins Inheritance Operators CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty goodies that make writing CSS fun again. Once you start tinkering with Sass, it will take your preprocessed Sass file and save it as a normal CSS file that you can use in your website. The most direct way to make this happen is in your terminal. Once Sass is installed, you can compile your Sass to CSS using the sass command. You'll need to tell Sass which file to build from, and where to output CSS to. For example, running sass input.sass output.css from your terminal would take a single Sass file, input.scss, and compile that file to output.css. You can also watch individual files or directories with the --watch flag. The watch flag tells Sass to watch your source files for changes, and re-compile CSS each time you save your Sass. If you wanted to watch (instead of manually build) your input.scss file, you'd just add the watch flag to your command, like so: sass --watch input.scss output.css ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// 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/jessesho... ////////// Social Twitter: http://twitter.com/iamjesseshow Anchor: https://anchor.fm/iamjesseshow Instagram: https://www.instagram.com/iamjesseshow Medium: https://medium.com/@iamjesseshow -
Views: 5201 Jesse Showalter
How to use the Command Line | Terminal Basics for Beginners
 
13:51
Todays video is about the basics of the command line. Commandline is the ultimate seat of power on your computer. He’s in the commandline you can perform from the most basic of tasks, to the most complex using nothing more than your keyboard and it’s installed operating system. Remember to Subscribe https://goo.gl/6vCw64 Command line is at its core, a place where you can type commands into the computer and watch magic app. This is the most basic of programming you tell a computer to do something and it follows your instructions. Speak to the computer if to speak his language to get it commands you have to know the commands first. A lot of people or really afraid of the commandline because it has no graphical user interface, it’s just you and the computer. In this video cover the very first few commands you should learn to master the commandline. There’s so much more that you can do, but you have to walk before you can run. As a web developer it’s Hibbett all that you understand how to use the command line with her you’re on Mac or Windows, it’s the foundation to using amazing tools like GIT and making your design and development workflow super powerful. Here are the commands covered in this video: ------------------------------------------------------------------------------ pwd - print working directory ls - List files cd directoryname - Change directory touch filename - Make file rm filename - Remove file rm -r directoryname - Remove directory clear - ear what’s on the screen nano - create a file and write in it ../ - go up one level Here are a couple helpful links for for the reading on the command line. --------------------------------------- https://www.davidbaumgold.com/tutorials/command-line/ http://blog.teamtreehouse.com/introduction-to-the-mac-os-x-command-line http://www.macworld.co.uk/feature/mac-software/how-use-terminal-on-mac-3608274/ ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 12643 Jesse Showalter
Free Resources to Learn Front-End Development 2018 | Coding Courses, Videos, Books, Tools and More
 
09:27
Learning Front-End Development can be a journey but it doesn't have to be a costly journey. Today I share my favorite free resources to learn front-end development skills like HTML, CSS, Javascript for no money at all. Remember to Subscribe https://goo.gl/6vCw64 These are just some of my favorite free resources for front-end developers, but I didn't want to overload you. I think there is enough here to keep any young developer busy learning the basics of web technologies like HTML, CSS, and Javascript until my next list comes out 😆 This is not a sponsored video (how would all these free product afford to pay me, they don;t charge 😆) /// Web Development Learning Sites & Courses https://www.freecodecamp.org/ https://courses.wesbos.com/ https://labs.jensimmons.com/ /// YouTube channels about programming and code https://www.youtube.com/channel/UCwRXb5dUK4cvsHbx-rGzSgw https://www.youtube.com/channel/UCyU5wkjgQYGRB0hIHMwm2Sg https://www.youtube.com/channel/UCyIe-61Y8C4_o-zZCtO4ETQ /// Free E-Books all about Javascript http://eloquentjavascript.net/index.html https://github.com/getify/You-Dont-Know-JS /// Free Tools for Front -End Developers https://codepen.io/ https://atom.io/ https://code.visualstudio.com/ /// Help and Knowledge https://stackoverflow.com/ https://css-tricks.com/ ------------------------------------------------------------------------------------ ////////// 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
Views: 13805 Jesse Showalter
Front-End Architecture | Setting Up & Organizing your Website Projects | Coding Tutorial
 
12:53
In this episode, I talk about how I organize my Front-End Develoment Projects to use modern technologies like SASS, Javascript, Task Runners and build my sites in a modular way. Remember to Subscribe https://goo.gl/6vCw64 Modern Web Front-End Web Development requires a bit more focus than it used to. You still basically link your stylesheets and scripts in your HTML document, but how you do that and how to redo that is important for workflow and the modular style of sites. Check out my video on ways to preprocess CSS: https://youtu.be/sMi9wuR22FE I cover the following in this video: 1. How to set up your project files organizationally 2. How to pre-process your CSS to make life easier 3. How to use, and what tools to use for Pre-Processing (task runners, terminal, Codekit) 4. How to think about code in a modular way The important thing is not that you set up and organize your projects just like me, but that you do it at all. There are many ways of doing that but it's about a way of thinking. Read these great articles to learn more about how to organize CSS. http://bradfrost.com/blog/post/atomic-web-design/ http://getbem.com/introduction/ https://smacss.com/ ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 48680 Jesse Showalter
Day in the Life of a Remote Designer | Jesse Showalter Vlog
 
09:41
What does a day in the life of a remote designer look like? I work as a remote all around digital designer at a tech startup. It's a newer lifestyle for me and has taken some getting used to. As a remote designer, I work from my home office, get to see my wife and kids more and use the solitude to focus and get lots of work done. Remember to Subscribe https://goo.gl/6vCw64 In today's video, I show you what working remotely as a designer is all about. It's not glamorous, it's not all coffee shops and vlogging with fun friends. It's about getting the work done from a different location. I choose to work remote because it allows me to be closer to my wife and kids, it allows me to spend more time working on side projects or reading books that I love than driving to an office in commute traffic. ------------------------------------------------------------------------------------ ////////// 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
Views: 9098 Jesse Showalter
Collaboration Tools For Designers - Remote Working Basics
 
07:55
In today's video, I focus on tools that help designers stay connected when working remote. Working remotely is a great thing, but as a designer, there can sometimes feel like something is missing. For me, it's that collaborative feeling of working in a team. Being able to sketch together, work together, concept things out in real time with real people. So whether it's your design team or your freelance clients these tools have been a help to me in bridging that creative gap. Remember to Subscribe https://goo.gl/6vCw64 This is not a sponsored video, I just really enjoy these products and use them daily. Project Management Trello - https://trello.com/ Asana - https://asana.com/ Smart Sheet - https://www.smartsheet.com/ Pivotal Tracker - https://www.pivotaltracker.com/ Communication Slack - https://slack.com/ Zulip - https://zulipchat.com/ Stride - https://www.stride.com/ Calendars Google Cal - https://calendar.google.com/calendar Team Up - https://www.teamup.com/ Harvest - https://www.getharvest.com/forecast Writing Dropbox Paper - https://paper.dropbox.com/ Google Drive - https://drive.google.com/ Evernote - https://evernote.com/ Concepting/Brainstorming Invision Freehand - https://www.invisionapp.com/ Video Chat Appear - https://appear.in/ Zoom - https://www.zoom.us/ Skype - https://www.skype.com/en/ Design Version Control Figma - https://www.figma.com/ Sketch - https://www.sketchapp.com/ Abstract - https://www.goabstract.com/ Kactus - https://kactus.io/ Design Systems Sketch - https://www.sketchapp.com/ Figma - https://www.figma.com/ Invision DSM - https://www.invisionapp.com/blog/announcing-invision-design-system-manager/ ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 4368 Jesse Showalter
Free Design Resources for Graphic, Web, & Product Design | Inspiration, Assets, Typography, Tools
 
09:55
Talking about amazing free resources for graphic designers, web designers and product designers. If you're just starting out in web design and need to know where to go for some good assets, or maybe you're a seasoned graphic or product designer that's in need a shot of inspiration. In this video I cover some of my favorite resources you can find online and the best part is... there all free. Well almost all of them, there are some tools at the end that cost but have free trials. Remember to Subscribe https://goo.gl/6vCw64 🤘 Links to all of the resources are below, and please let me know what type of videos you would like to see in the future. /// Inspiration Dribbble - https://dribbble.com/ Muzli - https://medium.muz.li/ Inspiration Grid - http://theinspirationgrid.com/ PTTRNS - https://pttrns.com/ // Assets The Noun Project - https://thenounproject.com/ Premium Pixels - http://www.premiumpixels.com/ Sketch App Rocks - http://sketchapp.rocks/ // Typography Google Fonts - https://fonts.google.com/ My Fonts - http://www.myfonts.com/ Grid Lover - https://www.gridlover.net/try // Stock Photography Unsplash - https://unsplash.com/ Pexels - https://www.pexels.com/ // Tools Coolers - https://coolors.co/ Invision - https://www.invisionapp.com/ Right Font - https://rightfontapp.com/ Sketch - https://www.sketchapp.com/ ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 54268 Jesse Showalter
Design Systems, Pattern Libraries & Style Guides... Oh My!
 
09:40
Style Guides, Pattern Libraries, and Design systems are all anyone is talking about lately, and for good reason. They all share a similar goal of creating a more consistent design process that increases productivity and also effectiveness. Some people don’t know the difference, so let's break them all down. Remember to Subscribe https://goo.gl/6vCw64 /// Design system The comprehensive set of values, semantics, syntax, and context that form the foundation of a shared design language /// Style guide The physical or digital document that represents the styles, patterns, practices, and principles of a company/brand and teaches how to use it /// Pattern library An organized set of related, reusable components, often containing code examples, design guidelines, and use cases ////////////////// Style Guides Foursquare Style Guide https://playfoursquare.s3.amazonaws.com/press/foursquare-brandguide.pdf Animal PLanet Styles Guide https://logoblink.com/wp-content/uploads/2009/01/animal_planet1.pdf Barnes & Noble http://portacreativeserver.com/vault/manualescorporativos/BRANDBOOK%20BARNES%20&%20NOBLE.pdf ////////////////// Pattern Libraries Pattern Library https://natashahockey.github.io/pattern-library/ MailChimp Pattern Library http://ux.mailchimp.com/patterns Bootstrap http://getbootstrap.com/2.3.2/ ////////////////// Design Systems Shopify Polaris https://polaris.shopify.com/ Lightning Design System https://www.lightningdesignsystem.com Carbon Design System http://carbondesignsystem.com/ ////////////////// Helpful Links Atomic Design | Atomic Design by Brad Frost http://atomicdesign.bradfrost.com/table-of-contents/ Website Style Guide Resources http://styleguides.io/ Building a Visual Language – Airbnb Design https://airbnb.design/building-a-visual-language/ ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// 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 https://www.amazon.com/shop/jesseshowaltertv
Views: 7042 Jesse Showalter
One Year Working Remote
 
08:24
I have officially been workin remote now for one year. It’s been a huge change for my family, schedule, lifestyle and also my character. Having now spent 365 days away from the office I feel like I have learned more on the topic and grown more as a designer. So I wanted to share what I have learned over the last year when it comes to working remote. Remember to Subscribe https://goo.gl/6vCw64 I did a video 2 years ago while I was living in Hawaii still about working from home when your sick but I honestly was speaking from a place of limited inexperience. At that point of my life I had never worked for more than 2 days away from the office. * Get up and get dressed * schedule your day * establish a designated work area * turn off distractions * take breaks * don’t feel guilty * Pomodoro technique * set your hours and stick to them * avoid interactions with family and friends * get some face to face time * reward yourself --- Lesson 1 Working remote is less fun than it seems. Don’t do it because it’s fun, do it because it’s work. Lesson 2 Working remote requires much more character, integrity, and moral fiber than working in an office. Lesson 3 Working remote is a situational give and take. What you gain in personal freedom and lack of commute, you lose in privacy and autonomy of schedule (you get pinged on slack after hours…often) Lesson 4 Working remote is lonely. There is no community, no coffee breaks with co workers, no shared experience. I know other designers who work on fully distributed teams or freelancers that sole work alone, but for people like me who work on teams that are anchored ion office and I’m the only remote worker, I feel like I miss out on so much of the group experience and there is no amount of video chatting that can remedy that. Lesson 5 Working remote is a voluntary mind game. Guilt, grief, shame, anxiety, stress and burnout are all possible things you are diving head first into when you take on a remote job. Sure there is also freedom, contentment, focus, pride, inspiration, and satisfaction… but you have to be aware of both sides of the coin and be ready to combat the flip side on a daily basis. ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 2503 Jesse Showalter
Sketch 52 | Top 5 Features
 
11:37
Sketch 52 has dropped and it’s awesome. It's full of exciting new features, including a totally redesigned UI, Data, Dark mode and more. In this video, I talk about my top 5 favorite features of 52. Remember to Subscribe https://goo.gl/6vCw64 - Sketch now comes with Dark mode on macOS Mojave - We’ve redesigned the UI from the ground up - You can now design with Data in Sketch - Text and Layer Styles in Symbols can now be overridden - More than 50 other enhancements and bug fixes, including a brand new tiling engine that really improves speed and performance of the app ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 20255 Jesse Showalter
Don't Go To Design School!!!
 
12:33
Do you need to Go to design or art school to be a designer? My answer is an emphatic no! This is not to say that design school is a bad thing, but if you don't have the money for the formal education that should not hold you back from starting a career in design. In this VLOG I go over what really matters when trying to work in the industry. Whether it's graphic design, web design, product design, or any other form of design, I know you can make your way with nothing more than the desire to succeed Some Good Books to get you started - The design of everyday things http://amzn.to/2mXYCRH - Graphic Design: The New Basics http://amzn.to/2mqIN1P - Hooked: How to Build Habit-Forming Products http://amzn.to/2nqLz9j - Don't Make Me Think: A Common Sense Approach to Web Usability http://amzn.to/2mY2NwN - Creative Workshop: 80 Challenges to Sharpen Your Design Skills http://amzn.to/2nqSdfu Some great Online resources - https://www.lynda.com/learning-paths/Design/become-a-graphic-designer - https://www.youtube.com/watch?v=bGJX9qT9hmk - https://www.youtube.com/watch?v=kqwgs7vBMkU - https://www.youtube.com/watch?v=hqYIe5Y76oY&t=881s Website http://www.jesseshowalter.com - Subscribe: https://www.youtube.com/user/JesseAtomic - Twitter: http://twitter.com/jesseatomic/ Instagram: https://www.instagram.com/iamjessesho... - Vlogging camera - Canon EOS M3: http://amzn.to/2hT54bo -
Views: 12891 Jesse Showalter
Timeline Plugin for Sketch | Create animations, interactions and export code
 
13:33
Timeline made by Anima is an awesome plugin for Sketch for Mac that has been absolutely blowing my mind lately 🔥 It's allowing me to make complex animation and do interaction design right inside of Sketch. Remember to Subscribe https://goo.gl/6vCw64 Timeline is built by the good people over at Anima and I gotta say.... they have outdone themselves this time. Check it out here https://timeline.animaapp.com/ Timeline allows you to use Sketch the way you always have plus take it to the next level by designing actual interactive component and animations that can be exported out to code! That's right real deal working code and amazing animation right from Sketch. In the video, I walk through how to download install setup basics of timeline animations interactions complex timings exporting to code and more Remember to Subscribe https://goo.gl/6vCw64 ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me https://www.buymeacoffee.com/jesseshowalter ////////// Social Twitter: http://twitter.com/iamjesseshow Podcast: https://anchor.fm/iamjesseshow Instagram: https://www.instagram.com/iamjesseshow Medium: https://medium.com/@iamjesseshow
Views: 17317 Jesse Showalter
Creative Interviews | Interviewing for Design Jobs
 
06:47
Getting ready to apply for full-time design positions? These are my top5 tips and a few practical lessons on how to prepare for your interview so you get the job. Remember to Subscribe https://goo.gl/6vCw64 In this video I cover: - The importance of confidence as a designer - What to put in your portfolio - Questions you will be asked in interviews - What to study before you go in - Character traits that are hirable - and more... LIKE FREE STUFF? //////////// If you're interested in my thoughts and experience on portfolio's download my free ebook called "Make Your Portfolio Count" -- http://eepurl.com/djC53b A Design Portfolio is the backbone of a creative as it shows what you’re capable of. It’s a showcase of your blood, sweat, talents, and triumphs. It’s your brand, be proud of it. I truly believe that being a designer is less about some pumped up CV or Resume and all about what you can do. If you are interested in submitting your portfolio for review to be a part of this series click here http://jesseshowalter.com/portfolio-reviews ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 1776 Jesse Showalter
Affinity Designer Top 10 Basic Tasks - Affinity Designer For Beginners
 
16:18
Affinity Designer is an amazing vector design tool for Mac and windows. It's full-featured, powerful and friendly for beginners. In this design tutorial, I show you the 10 most common basic tasks you might want to accomplish inside Affinity Designer. Remember to Subscribe https://goo.gl/6vCw64 If you are just starting out with Affinity Designer or Vector Design/ Graphic Design Software in General, this tutorial should get you up and running. 1) Making a new document in Affinity Designer 2) Understanding the interface of Affinity Designer 3) Using the pre-made shapes in Affinity Designer 4) Custom Shapes in Affinity Designer 5) How to use colors in Affinity Designer 6) Understanding layers in Affinity Designer 7) How to combine shapes with the Boolean operations in Affinity Designer 8) How to draw your own vectors with the vector brush tool and the pen tool in Affinity Designer 9) How to add text in Affinity Designer 10) How to save and export in Affinity Designer Affinity Designer offers some pretty fantastic features for graphic design, ui design, print design and more, and I highly suggest you check it out of you have been an Illustrator user for a while and are looking for a cheaper alternative. Other Affinity Tutorials: Advanced Skin Retouching - https://youtu.be/5FlJbe98Oc8 Masking Images in Text - https://youtu.be/VP0Tw-pVHRY Change Eye Color - https://youtu.be/vCPiqyoy2jc ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 44303 Jesse Showalter
Intro to Figma - Beginners guide to Figma Basics
 
16:08
Figma is one of my favorite digital design softwares of all time. If you're just starting out with Figma or debating on whether you should make the switch this tutorial is for you. LIKE FREE STUFF? //////////// If you're interested in my thoughts and experience on the topic download my free ebook called "Make Your Portfolio Count" http://eepurl.com/djC53b Remember to Subscribe https://goo.gl/6vCw64 I have been using Figma for over a year in my design work and I realized I have never done a basic intro to Figma that covers all the topics a beginner would need to understand the Figma basics. So here it is Figma for Beginners... a sort of 101 class so to speak. In this video, I cover all the basics you would need to know you start using Figma today in your professional design work. By the time you're done watching the video, you should be able to download the program, install, start making amazing things, and wonder why you ever waited to make the switch. If you are still using something like Adobe Photoshop for digital design it's time for you to experience something better. In this video I cover: - Benefits to using Figma - all operating systems and browser - collaborative real time - commenting - prototyping - Brief tour of the UI - Pages vs Artboards - Working responsive - Adding Shapes - Details panel - Pen Tool - Boolean Operations and Masks - Commenting - Using symbols - Sharing - Prototyping - Exporting - physical - Code I know it sounds like a lot but stick with me and hopefully, you'll learn everything you need to know to starting making amazing designs in Figma. ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 5016 Jesse Showalter
Better Icons with Sketch Layer Styles
 
06:55
Managing Icons has always been a hassle. Even in prior version of Sketch, creating and managing an icon library was a bit of a hassle. If you are an avid Sketch user you may have used the color symbol hack to be able to have variation in your icons... well say goodbye to hacks and say hello to Layer Styles. Remember to Subscribe https://goo.gl/6vCw64 In todays video I show you a new iconography workflow using Sketch for Mac new Layer Style feature. When I say new I don't mean "Brand New". Layer styles have been around for a while, they just have not been as awesome as they are until now. Applying Layer styles allows you to work fast and maintain an icon library like never before. Let me know your workflow in the comments. ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equipment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 2795 Jesse Showalter
Contracts & Proposals for Creatives | Business of Design
 
07:34
//////////////// Sponsored Links Free download PDFelement Trial on Win/Mac:   https://goo.gl/oapc7e Get exclusive 20% OFF by using promo code: SENYTJS (Expire 31. July,2018) Free download PDFelement on iOS  https://apple.co/2zmCubC Client Documents are an inevitable part of doing freelance work. I'm talking about Contracts and Proposals of course. In this video, I cover the bare basics of doing business as a freelancer and talk about the two most important documents that you will deal with as a freelancer. Remember to Subscribe https://goo.gl/6vCw64 Proposals serve as a foundational part of the client process. It allows the client to find out more about how to plan on tackling the project. A good proposal can bring a large amount of confidence and trust before a project even kicks off. Contracts will save you from getting into serious legal trouble. Let me say this very seriously... NEVER WORK WITHOUT A CONTRACT!!! /////////// Other helpful links https://stuffandnonsense.co.uk/projects/contract-killer https://www.goprospero.com/ https://www.goprospero.com/ ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 2001 Jesse Showalter
The 10 Principles for Good Design - Dieter Rams | Basics of Design
 
09:42
Dieter Rams is one of the most prolific designers of our and time and has really helped to shape the face of good design. In this video I cover his famous 10 Principles for Good Design. Good design is innovative The possibilities for innovation are not, by any means, exhausted. Technological development is always offering new opportunities for innovative design. But innovative design always develops in tandem with innovative technology, and can never be an end in itself. Good design makes a product useful -------------------------------------------------------------------------- A product is bought to be used. It has to satisfy certain criteria, not only functional, but also psychological and aesthetic. Good design emphasises the usefulness of a product whilst disregarding anything that could possibly detract from it. Good design is aesthetic -------------------------------------------------------------------------- The aesthetic quality of a product is integral to its usefulness because products we use every day affect our person and our well-being. But only well-executed objects can be beautiful. Good design makes a product understandable -------------------------------------------------------------------------- It clarifies the products structure. Better still, it can make the product talk. At best, it is self-explanatory. Good design is unobtrusive -------------------------------------------------------------------------- Products fulfilling a purpose are like tools. They are neither decorative objects nor works of art. Their design should therefore be both neutral and restrained, to leave room for the users self-expression. Good design is honest -------------------------------------------------------------------------- It does not make a product more innovative, powerful or valuable than it really is. It does not attempt to manipulate the consumer with promises that cannot be kept. Good design is long-lasting -------------------------------------------------------------------------- It avoids being fashionable and therefore never appears antiquated. Unlike fashionable design, it lasts many years - even in todays throwaway society. Good design is thorough down to the last detail -------------------------------------------------------------------------- Nothing must be arbitrary or left to chance. Care and accuracy in the design process show respect towards the consumer. Good design is environmentally friendly -------------------------------------------------------------------------- Design makes an important contribution to the preservation of the environment. It conserves resources and minimises physical and visual pollution throughout the lifecycle of the product. Good design is as little design as possible -------------------------------------------------------------------------- Less, but better - because it concentrates on the essential aspects, and the products are not burdened with non-essentials. Back to purity, back to simplicity. The 10 Design Principles https://www.vitsoe.com/us/about/good-design Learn More About Dieter Rams https://en.wikipedia.org/wiki/Dieter_Rams Remember to Subscribe https://goo.gl/6vCw64 ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9V
Views: 7998 Jesse Showalter
How to Design a Seamless Repeating Pattern - Design Tutorial
 
04:34
One of the ways to make your designs stand out is by creating a seamless repeating pattern to use in your web project or branding project. It doesn't matter what program you are using, it's pretty much the same in every program. Remember to Subscribe https://goo.gl/6vCw64 Follow these simple steps to make your repeating pattern: 1. Make a perfectly square artboard or canvas 2. Choose your patterns subject matter 3. Lay your items overlapping the left and top edge 4. Add the width of the canvas to each object potion in your info panel (if the artboard it 500x500... add 500 to your items position) 5. fill in the middle portion of the artboard 6. Export and enjoy 🚀 ------------------------------------------------------------------------------------ ////////// 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
Views: 4041 Jesse Showalter
Nested Symbols in Sketch - Wunderlist Todo App - Let's Make That In Sketch
 
27:20
Lesson File http://bit.ly/2nwsIty This series is all about learning Interface design by doing. Sketch for Mac is an amazing design tool that has greatly improved a lot of designers workflow. The goal of this series is to help people learn to use Sketch through bite-sized recreations of already established popular designs. Sketch introduced nested symbols in 2016 and it changed the interface design workflow, in my opinion, Learning this new workflow will greatly improve your design consistency and speed. Nested symbols allow you to create a master version of a component and then make as many instances of it as you want To create a nested Symbol, just drag an existing instance into another Symbol’s master. It’s that simple! Any updates you make to the Symbol’s master will see the changes propagate throughout your design no matter if they’re inside another Symbol or not. As well as dragging an existing instance into a master, and inserting via the toolbar item, you can also select multiple instances of different Symbols and press Create Symbol in the toolbar. There’s no limit to how deep you can nest Symbols, but please note a Symbol cannot contain an instance of itself. - Sketch for Mac - https://www.sketchapp.com/ - Website http://www.jesseshowalter.com - Subscribe: https://www.youtube.com/jesseshowalter - Twitter: http://twitter.com/jesseatomic/ Instagram: https://www.instagram.com/iamjessesho... - Vlogging camera - Canon EOS M3: http://amzn.to/2hT54bo - Drone- DJI Phantom P3-STANDARD Quadcopter Drone with 2.7K HD Video Camera http://amzn.to/2n5iSQV
Views: 10960 Jesse Showalter
1 - Design & Code a Responsive Landing Page from Start to Finish - Series Intro
 
04:05
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. Remember to Subscribe https://goo.gl/6vCw64 This is the series intro where I talk quickly about what you can expect from the series and how you can best follow along and get the most out of the series itself. 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. 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 ------------------------------------------------------------------------------------ ////////// 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
Views: 14036 Jesse Showalter
Adobe XD Basics | Top 10 Things to know when getting started with Adobe XD
 
19:26
Adobe XD is an awesome design tool for people who want to focus on UI Design, UX Design, Prototyping, Responsive Web Design and more. These are the 10 most basics tasks you will need to know about when you get started. Remember to Subscribe https://goo.gl/6vCw64 Check out Dev Mountain: https://devmountain.com/?utm_source=Jesse%20Showalter If you are just starting out with Adobe XD or UI Design/ Graphic Design Software in General, this tutorial should get you up and running. 1. Artboards 2. UI Tour 3. The Pen tool 4. Symbols and Styles 5. Repeat Grids 6. Responsive Resizing 7. Preview 8. Images 9. Prototyping 10. Sharing Adobe XD is pretty awesome. It's still a fairly new tool at this point but has tons of potential. ------------------------------------------------------------------------------------ ////////// Sign up for my Monthly Newsletter http://jesseshowalter.com/newsletter ////////// Equiptment https://www.amazon.com/shop/jesseshowaltertv ////////// Support Me 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
Views: 25635 Jesse Showalter
How to Retouch Skin in Affinity Photo | Graphic Design Tutorial
 
09:56
In today's video I show my tried and true 3 step process for quick and easy skin retouching in Affinity Photo. How to retouch Skin in Affinity Photo is for people who want to make changes without hours of work. Remember to Subscribe https://goo.gl/6vCw64 Stock Photo - https://unsplash.com/@erik_lucatero?photo=d2MSDujJl2g Affinity Photo File - http://www.jesseshowalter.com/assets/uploads/files/skin-retouch.zip Retouching skin can be a time-consuming endeavor, but good news me and Affinity Photo are here to bring you some awesome solutions that will get you retouching skin in no time at all. The 3 steps I show here today will work on other programs like photoshop but Affinity Photo makes it so easy you gotta check it out. Now I am sure there are people out there that could do a much better job at retouching skin than i can, but this video isn't for them. This video is for people who are on a deadline, making websites or graphics and need to know how to do a little bit of retouching without breaking the bank of time. Step 1: Frequency Separation basically splitting the image into varying levels of definition Step 2: Image Correction using all the amazing tools that Affinity/Photoshop has to offer you can start retouching the photo pretty quickly to get the result you want. Blemish removal tool, clone stamp tool, etc... Step 3: Color Correction This is the equivalent of putting foundation on the subject and evening out the skin from those red splotchy areas. Just use lots of color adjustments, layer masks and be aware of the contrasting colors. That's it!!! I know so simple right :) ------------------------------------------------------------------------------------ ////////// Website http://www.jesseshowalter.com - ////////// Subscribe: https://goo.gl/6vCw64 - ////////// 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/2CpodH9
Views: 23129 Jesse Showalter
3 Ways to Preprocess CSS in 3 Minutes
 
03:14
Preprocessing CSS doesn't have to be scary, intimidating, or confusing. CSS Preprocessing with tools like Sass or Less is so common at this point that it's a no brainer choice. It speeds up your workflow, makes your code more maintainable, and easier to write. There is so much that could be said about preprocessing but in this video, we just scratch the surface and I show you a few ways to get your project up and running within 3 minutes using Sass. The Three methods mentioned here are: 1. Sass Watch - http://sass-lang.com/ 2. Codekit - https://codekitapp.com/ 3. Gulp.js - http://gulpjs.com/ Details Website http://www.jesseshowalter.com - Subscribe: https://www.youtube.com/jesseshowalter - Twitter: http://twitter.com/jesseatomic/ Instagram: https://www.instagram.com/iamjessesho... - Vlogging camera - Canon EOS M3: http://amzn.to/2hT54bo - Drone- DJI Phantom P3-STANDARD Quadcopter Drone with 2.7K HD Video Camera http://amzn.to/2n5iSQV
Views: 5470 Jesse Showalter
Five Cheap & Awesome Things On My Desk | Cool Gear for Designers
 
05:33
Sometimes as a Designer, little things in your office or on your desk can make a huge difference. Especially when they are really amazing things that are low in cost. I'm a huge fan of items that offer me big value for a small price tag and these qualify for me. Remember to Subscribe https://goo.gl/6vCw64 Links to all products are below, let me know what other things you have on your desk that bring you value. Moleskin Notebook - http://amzn.to/2FVJr5c Dry Erase Board - http://amzn.to/2FzIOiv Bendy Phone Stand - http://amzn.to/2FQNYpD Water Bottles - http://amzn.to/2FPssSm Purgo USB C Hub - http://amzn.to/2tT8Urx ------------------------------------------------------------------------------------ ////////// 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
Views: 5190 Jesse Showalter