Disclosure: Some of the links above are affiliate links. If you use them to make a purchase through one of our partners we may receive a small commission, at no cost to you. Read our full affiliate, advertising and privacy policy here.

Website Design

Creating GOOD digital product imagery [Video]

Creating GOOD digital product imagery

Marketing a physical product can be easy, given you can take beautiful flatlays/lifestyle shots… But when you’re marketing an app or SAS product, all you have is screenshots. 😐
I spoke to Cory Etzkorn recently, who is a Designer at Notion (and you know I love Notion). He spoke about how Notion prioritise making imagery that looks & feels real. I really loved what he had to say, and wanted to share it here.

You can watch the full episode interview here: https://youtu.be/jKx2cjy2FRo

🚀 CharliMarieTV is now powered by Figma! https://bit.ly/figma-charli
Figma is a design tool that helps teams create, test, and ship better designs from start to finish. And it’s free! 🙂

00:00 An important part of marketing materials
00:36 Hear what Cory has to say
01:46 Who creates all the product imagery?
02:45 Who the imagery is created for
04:11 UI straight from a ‘real creator’s’ account
05:02 How do you handle digital product shots? 💬



My videos don’t have pre-roll ads because ads are annoying and I don’t want you to have to sit through them. If you want to support me and my channel the best thing you can do is join my Patreon!

You’ll get extra content and ways to learn, like behind-the-scenes process info, downloadable assets and a patron-only podcast! Sign up here: http://patreon.com/charlimarie



Hello there! I’m Charli and I’m a half-British, half-kiwi web and graphic designer currently living in Valencia and posting design videos about tools, projects, and concepts as well as vlogs of my life as a designer. Please subscribe and say hi in the comments so we can be friends 🙂



Buy my font: http://charlimarie.store
My site & blog: https://charlimarie.com
Design Life podcast: http://designlife.fm
Inside Marketing Design podcast: https://insidemarketingdesign.co


Twitter: https://twitter.com/charliprangley
Instagram: http://instagram.com/charliprangley
Facebook: http://www.facebook.com/charlimarieTV
Twitch: https://www.twitch.tv/charlimarietv


Music from Epidemic Sound. If you want to try it out, sign up using my link! http://charlimarie.com/epidemicsound

Intro & end card animation by hand lettering animator Austin Saylor: http://www.austinsaylor.com/

Editing by Nancy Palm http://nancypalm.com & Belén Albiol https://www.instagram.com/molen.audiovisual

Watch/Read More

Disclosure: Some of the links above are affiliate links. If you use them to make a purchase through one of our partners we may receive a small commission, at no cost to you. Read our full affiliate, advertising and privacy policy here.

Website Design

How To Create A Portfolio Website In Vue.JS | Session 16 | #website | #vuejs | #programming [Video]

Don’t forget to subscribe! In this project series, you will learn how to create a Portfolio website in Vue.Js. We'll focus on HTML, SASS, and JavaScript with the framework Vue.js. The project focus will be on typical elements on personal portfolio websites, such as common layout components, the video player, how to list and sort data, how to data-bind and validate a contact form, and more.This series will cover all the details (resources, tools, languages, etc) that are necessary to build a complete and operational Personal Portfolio Website. You will be guided through all the steps and concepts, starting from the basic ones like setting up the right tools and frameworks to the more advanced topics related to the website’s development. And ultimately, you will be able to create a portfolio website in vue.js without any difficulty. Introduction:https://www.youtube.com/watch?v=SehAZmGgmx0&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=19&ab_channel=EducationEcosystemSession 01: Setting up the Environmenthttps://www.youtube.com/watch?v=cR7QnWlXTVA&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=19&ab_channel=EducationEcosystem Session 02: Front-End - Basic structure of a website https://www.youtube.com/watch?v=wlEmjhcS23g&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=20&ab_channel=EducationEcosystemSession 03: Navigation bar and multiple language support aka translationshttps://www.youtube.com/watch?v=nnhJ2KJMIo0&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=21&ab_channel=EducationEcosystemSession 04: Creating a side-bar componenthttps://www.youtube.com/watch?v=ZjfOEkz1s28&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=22&ab_channel=EducationEcosystemSession 05: Creating the modal component for our sitehttps://www.youtube.com/watch?v=yLJ1jVvFLPk&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=23&ab_channel=EducationEcosystemSession 06: Continuation of the modal componenthttps://www.youtube.com/watch?v=bqd_gpszjMU&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=24&ab_channel=EducationEcosystem Session 07: Creating the layout of our sitehttps://www.youtube.com/watch?v=DGUH_jig2G0&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=25&ab_channel=EducationEcosystem Session 08: Flex basicshttps://www.youtube.com/watch?v=0Dy84KYQS5c&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=26&ab_channel=EducationEcosystem Session 09: Layout and stylinghttps://www.youtube.com/watch?v=cDw3pDHKmDE&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=27&ab_channel=EducationEcosystem Session 10: Stylinghttps://www.youtube.com/watch?v=Y8pNwdeCI5U&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=28&ab_channel=EducationEcosystem Session 11: Playback controlshttps://www.youtube.com/watch?v=thbgA6BF1yU&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=29&ab_channel=EducationEcosystem Session 12: Volume controls and seeks controlshttps://www.youtube.com/watch?v=z_zXm-uOwHE&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=30&ab_channel=EducationEcosystem Session 13: Skills view, how to list skillshttps://www.youtube.com/watch?v=-M2sok9NNUA&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=31&ab_channel=EducationEcosystem Session 14: Skills view, rating elementhttps://www.youtube.com/watch?v=fnCgwAXJ1kw&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=32&ab_channel=EducationEcosystem Session 15: Contact form, and data-binding https://www.youtube.com/watch?v=xczJOSJ6ZOA&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=33&ab_channel=EducationEcosystemSession 16: Unit, and E2E testinghttps://www.youtube.com/watch?v=3rcGtmqAyEU&list=PLQbzkJk10-f6tWYKW68DMpX85TR62u_kg&index=34&ab_channel=EducationEcosystem Join our community for more projects.Sign up for free!https://www.education-ecosystem.com/signupSubscribe to our YouTube channel for more projects.https://www.youtube.com/channel/UC1cOIo0icmgyk0KaYXKgDZQLearn how to build products by practicing with our free projects onhttps://www.education-ecosystem.com

Website Design

5 Techs & Tools Im Learning In 2022 For Web Development [Video]

These are the 5 things I'll be learning this year to increase my value and skills as a Web Developer!How I became a Web Developer in 9 monthshttps://www.youtube.com/watch?v=T6mlCqS--xc&t=2sJoin the community Discord!https://discord.gg/mxjY4QC3nwAs always feel free to follow and support me on the platforms below!Twitter: @Th3MichaelWhiteGitHub: mikewhite628linkedIn: https://www.linkedin.com/in/th3michaelwhite/

Website Design

How to Make a Complete Portfolio Website using HTML CSS & JAVASCRIPT [Video]

#HTML#CSS#JAVASCRIPT#PORTFOLIO#WEBSITEHow to Make a Complete Portfolio Website using HTML CSS & JAVASCRIPTYour portfolio is your resume and your business card. Learn how to build a responsive personal development portfolio website from scratch and make your first impression count.In this video, I have shown you how to create a complete responsive portfolio website using html css and javascript. You can watch this video and easily able to create this type of responsive portfolio website even if you're a beginner. Download Codes : https://drive.google.com/drive/folders/1b6cxXA0h-_XALPywgJfVBqk16I6VF1en?usp=sharingImages : https://unsplash.com/Track: Lost Identities x Rob Roth - For Me [NCS Release]Music provided by NoCopyrightSounds.Watch: https://youtu.be/0x5-sk0JwM0Free Download / Stream: https://ncs.io/ForMeTrack: ROY KNOX x Derpcat - Only You (Feat. imallryt) [NCS10 Release]Music provided by NoCopyrightSounds.Watch: https://youtu.be/p1l4XeIsw70Free Download / Stream: https://ncs.io/OnlyYou