209 Courses delivered On Demand

Ready to go beyond the basics? The JavaScript Advanced Training Course is tailored for learners who already understand the fundamentals and are eager to sharpen their scripting edge. This course dives into asynchronous programming, closures, higher-order functions, module patterns, and more – all laid out with clarity and purpose. Whether you're brushing up or building out your skills, you'll find this course paced to keep things flowing without ever feeling overwhelming. Think of it as levelling up without the drama. Expect engaging lessons designed to explain the deeper mechanisms behind how JavaScript truly operates in the browser. We’ll unravel common pitfalls, explore performance techniques, and demystify complex concepts in a straightforward way. It's ideal for developers who want to write cleaner, faster, and more efficient code – all while learning in a structured, accessible format. So, if you're looking to refine your scripting finesse and take control of your code, this course is made with you in mind. Learning outcomes: Understand the basics of JavaScript programming language Learn how to work with loops and operators Understand how to enable and place JavaScript on a web page Develop skills in creating multimedia and interactive features using JavaScript Learn how to use image maps and animations in web development The JavaScript Advanced Training course is designed for individuals who are interested in expanding their knowledge of JavaScript programming language. This course covers advanced topics such as loops, variables, and operators, and how to enable and place JavaScript on a web page. Students will also learn how to use JavaScript to create multimedia and interactive features, including image maps and animations. This course is ideal for those who have a basic understanding of JavaScript and are looking to take their skills to the next level. It is also suitable for web developers who want to enhance their skill set and create more interactive and engaging web pages. JavaScript Advanced Training Course Curriculum Section 01: Introduction Section 02: Loop Section 03: Example Section 04: Print and Animation Section 05: Image Map and Multimedia Section 06: JavaScript Enabling and Placement Section 07: JavaScript Variables and Operators Section 08: While Loop How is the course assessed? Upon completing an online module, you will immediately be given access to a specifically crafted MCQ test. For each test, the pass mark will be set to 60%. Exam & Retakes: It is to inform our learners that the initial exam for this online course is provided at no additional cost. In the event of needing a retake, a nominal fee of £9.99 will be applicable. Certification Upon successful completion of the assessment procedure, learners can obtain their certification by placing an order and remitting a fee of __ GBP. £9 for PDF Certificate and £15 for the Hardcopy Certificate within the UK ( An additional £10 postal charge will be applicable for international delivery). CPD 10 CPD hours / points Accredited by CPD Quality Standards Who is this course for? Individuals with a basic understanding of JavaScript who want to expand their knowledge Web developers who want to enhance their skill set Anyone interested in creating interactive and engaging web pages Students pursuing a career in web development Entrepreneurs and business owners who want to develop their own websites Requirements There are no formal entry requirements for the course, with enrollment open to anyone! Career path Web Developer Front-end Developer Full-stack Developer Software Engineer UI/UX Designer Salary range in the UK: £25,000 - £60,000 Certificates Certificate of completion Digital certificate - £9 You can apply for a CPD Accredited PDF Certificate at the cost of £9. Certificate of completion Hard copy certificate - £15 Hard copy can be sent to you via post at the expense of £15.

If you've ever wondered how websites come to life in your browser, this Front End Web Development Training is your ideal introduction. Whether you're new to coding or brushing up on your knowledge, this course walks you through the essential languages of the web—HTML, CSS, and JavaScript—with clarity, structure, and a touch of digital charm. You’ll gain insight into how websites are built, styled, and made interactive, all from the comfort of your own screen. Built with beginners in mind but welcoming to all curious minds, the course breaks down web development into manageable, engaging sections. It’s tailored to help you understand the building blocks of the internet without overwhelming jargon or confusing detours. From creating simple layouts to adding life with animations and scripts, each module nudges you further into the world of modern web design. If your goal is to confidently understand what goes into building a page, this training might just become your favourite browser tab. Learning Outcomes: Understanding of the complete front-end development process Knowledge of cascading style sheets and transitions Ability to work with advanced JavaScript features Familiarity with JQuery and selectors Understanding of Bootstrap and grid system for responsive design The Front End Web Development Training for Everyone is a comprehensive course designed to provide individuals with the skills and knowledge needed to develop professional front-end websites. This course covers a range of topics, including cascading style sheets, advanced JavaScript, JQuery, Bootstrap, and grid system. Participants will also learn how to create portfolio pages and other interactive designs. This course is suitable for anyone who wants to learn front-end web development, including beginners and professionals who want to expand their skills. With this course, participants will gain a solid foundation in front-end development and be able to build responsive websites that are accessible across various devices. Front End Web Development Training for Everyone Course Curriculum Section 01: Complete Front-End Development Journey Section 02: Cascading style sheets Section 03: Transitions and Data Types Section 04: Advanced JavaScript and Its Features Section 05: JQuery and Selectors Section 06: Bootstrap and Grid System Section 07: Creating Portfolio Page How is the course assessed? Upon completing an online module, you will immediately be given access to a specifically crafted MCQ test. For each test, the pass mark will be set to 60%. Exam & Retakes: It is to inform our learners that the initial exam for this online course is provided at no additional cost. In the event of needing a retake, a nominal fee of £9.99 will be applicable. Certification Upon successful completion of the assessment procedure, learners can obtain their certification by placing an order and remitting a fee of __ GBP. £9 for PDF Certificate and £15 for the Hardcopy Certificate within the UK ( An additional £10 postal charge will be applicable for international delivery). CPD 10 CPD hours / points Accredited by CPD Quality Standards Who is this course for? Individuals who want to learn the basics of front-end web development and enhance their knowledge and skills Professionals who are looking to switch their careers to front-end web development Business owners who want to develop their own website or manage their existing website Freelancers who want to offer front-end web development services to their clients Students who want to learn front-end web development as a part of their curriculum or as a hobby. Requirements There are no formal entry requirements for the course, with enrollment open to anyone! Career path Front-end Developer: £20,000 - £60,000 UI/UX Designer: £22,000 - £70,000 Web Designer: £18,000 - £50,000 Web Developer: £22,000 - £70,000 Full Stack Developer: £30,000 - £90,000 Certificates Certificate of completion Digital certificate - £9 You can apply for a CPD Accredited PDF Certificate at the cost of £9. Certificate of completion Hard copy certificate - £15 Hard copy can be sent to you via post at the expense of £15.

Description Explore the basics of typography for web and mobile UI to make your design powerful with the Level 3 Diploma in Typography for UI Designers course. The element of every layout is essential while designing a website. The course starts by explaining the typography terms and anatomy. You will learn to create amazing web and mobile app design by using meaningful fonts. The use of fonts, line-height and letter spacing, Google android typography, using Vertical Rhythm in Bootstrap will be discussed here. Then you will learn to balance balancing your design by using LEGO Blocks method. Finally, the procedures for connecting your Photoshop Screen to iPhone or Android Device, and many other essential concepts will be reviewed in the course. Shortly, the course covers the concepts of Font Pairing, Web Typography, App Typography & Vertical Rhythm. Entry Requirement: NOT for Novices (Must have some Photoshop Experience) Web Designers Mobile App Designers All Designers who think their design have something missing Web Developers Graphic Designer Assessment: At the end of the course, you will be required to sit an online multiple-choice test. Your test will be assessed automatically and immediately so that you will instantly know whether you have been successful. Before sitting for your final exam, you will have the opportunity to test your proficiency with a mock exam. Certification: After completing and passing the course successfully, you will be able to obtain an Accredited Certificate of Achievement. Certificates can be obtained either in hard copy at a cost of £39 or in PDF format at a cost of £24. Why choose us? Affordable, engaging & high-quality e-learning study materials; Tutorial videos/materials from the industry leading experts; Study in a user-friendly, advanced online learning platform; Efficient exam systems for the assessment and instant result; The UK & internationally recognized accredited qualification; Access to course content on mobile, tablet or desktop from anywhere anytime; The benefit of career advancement opportunities; 24/7 student support via email. Career Path After completing this course you will be able to build up accurate knowledge and skills with proper confidence to enrich yourself and brighten up your career in the relevant job market. Introduction to Typography 1.2.Intro to typography course 00:05:00 1.3. how typography cousre is laid out 00:02:00 1.4.What are Font Families 00:05:00 1.5.typography-antomy-terms 00:07:00 1.6.Humanist Old and Transitional 00:07:00 1.7.Sans-Serif Script Other Sans 00:06:00 1.8. Line-length in Typography 00:03:00 1.9.Alignments of your text 00:05:00 1.10.Line-height matters 00:07:00 1.11.Letter Spacing kerning 00:05:00 1.12.exercise to apply all we learned 00:11:00 More about Typography 2.1.Different Types of Hyphens & Dashes 00:02:00 2.2. About Quotation Marks 00:03:00 Typography Scales and Grids 3.1.1Expanding Scales-NEW 00:07:00 3.1.Roles Of Typefaces-1 00:05:00 3.2.Typography Scale-1 00:03:00 3.3Type Hierarchy Online Tools 00:05:00 3.4.How Many Levels Of Hierarchy-update 00:03:00 3.5.Vertical Rhythm-updated 00:05:00 3.6.Vertical Rhythm In Photoshop 00:07:00 3.7.exercise Vertical Rhythm-1 00:12:00 3.8.modular Grid 00:11:00 EXERCISES: Modular + Baseline Grid Design Ultimate Exericse 4.1.prepare Modular Grid For Design Exericse 00:11:00 4.2.Modular Design part 1 00:16:00 4.3.Modular design 2nd 00:10:00 4.4.Modular Design Refining the design 00:03:00 4.5.Modulr Design 3rd Layout 00:10:00 How to Select Fonts? 5.1.how Many Fonts 00:05:00 5.2.Moods Voices Of Typefaces- 00:13:00 5.3.colors Efffect On Typo 00:04:00 How to Pair Fonts? 6.1.Font Pairing Intro-Updated 00:04:00 6.2.X-height Matching 00:05:00 6.3.Contrast Matching 00:10:00 6.4.Look For Similar Features 00:10:00 6.5.Avoid Too Similarity 00:04:00 6.6.Pairing Fonts Same Family Designer 00:05:00 6.7.Online Tools Font Pairing 00:06:00 How to get Variation in text for Great Designs 7.1.variation with bold italic 00:04:00 7.2.variation with colors 00:03:00 7.3.Variation with Reverse-colors updated- 00:03:00 7.4.variation with lineheight 00:04:00 EXERCISES: Dribbble LEVEL Designs 8.1. Dribbble Hero Design preperation 00:05:00 8.2.dribbble Hero Design V1 Part 1 00:16:00 8.3.dribbble Hero Design V1 Part 2 00:16:00 8.4. Dribbble Hero Variation Intro 00:04:00 8.5. Dribbble Hero Variation 2 Part 1 00:08:00 8.6. Dribbble Hero Variation 2 Part2 00:06:00 Exercise: Social Media Ad Design with 3 different fonts 9.1.summer Discount Ad DesignPreperations 00:04:00 9.2 Preparing base of design 00:07:00 9.3. Adding Text and styles 00:14:00 9.4.final Adjustments 00:03:00 Nature Health Themed Typography Exercises 10.1.juicy Design Exercise Preperations-1 00:03:00 10.2.making Of Juicy Design-2 00:16:00 10.3.juicy Designs Final-3 00:12:00 Typography for Iphone and Android App Designs (Mobile App Typography) 11.1 Intro IOS point sizing 00:05:00 11.2.IOS Font Specs 00:03:00 11.3.Designing multiple IOS Screens 00:14:00 11.4. Student Question About Resoltutions 00:14:00 11.5.connect Your Iphone With Photoshop 00:05:00 11.6. Android Typography 00:04:00 11.7.android Design Exercise For All Sizes 00:09:00 Typography for Web Developers 12.1.Using Google Fonts 00:04:00 12.2.using Premium Fonts 00:06:00 12.3.Intro to css font sizigin 00:03:00 12.4.what Is Em Font Size 00:08:00 12.5.What is rem font size 00:05:00 12.6.How percentage font size works 00:04:00 12.7.How vw font unit works 00:04:00 Responsive Typography for Developers 13.1.how Vertical Rhythm Works In CSS 00:08:00 13.2.Gridlover Exercise 00:08:00 13.3.custom Typographic Scale Boostrap-3 00:13:00 13.4.dont Use Code From Typescale 00:02:00 New and Latest in Typography 14.1.responsive Typography Intro 00:07:00 14.2.different Ratios And Scales In Responsive Typography 00:10:00 14.3.percentage Value Technique For Responsive Type 00:12:00 15.1 Color Fonts 00:05:00 15.2 variable-fonts101 00:08:00 Mock Exam Final Exam Certificate and Transcript Order Your Certificates and Transcripts 00:00:00

Learn to create the responsive website with the Modern Web Design - Wireframes to Style Guide course. To make a website responsive is the first work nowadays because of the number of mobile and tab users. Older website owners are now starting to recreate their website or make it responsive. In this course, you will master the skills for creating the responsive website using Balsamiq Mockups, Photoshop, Zeplin and Invision App. The course teaches you how to design for the developers. The system of building Prototypes for showing website flows and interactions, designing Wireframes using Balsamiq Mockups, design and develop a coded Style Guide for Developers, creating Online Style Guide using Zeplin, creating grid system for different screens e.g. PC, Tablet or Smart Phones will be discussed in the course, Upon completion, you will be able to design and develop responsive websites. What Will I Learn? Learn the professional process of a Responsive Web Design Project Know the Questions to get project details from Clients What should a Design Brief have? Learn all about building and using Mood Boards in your projects Understand the IDEATION process (early Sketching) Design and Develop Grid system for different screens e.g PC, Tablet or Smart Phones Design Wireframes using Balsamiq Mockups How to set up Grids and Guides for Responsive Web Design Learn the developers' mind 'How Developers code your design ' How to design and develop a coded Style Guide for Developers Build Prototypes to show website flows and interactions Create Online Style Guide using Zeplin How to Design for Developers Understand design frameworks like Atomic Design or Content first approach Learn tools like Zeplin, Balsamiq Mockups and Invision App Requirements Good knowledge of Adobe Photoshop CC Modern Web Design - Wireframes to Style Guide 0.2 what we will cover in this course 00:03:00 1.1 skills-and-apps-you-need-to-take-this-courseautogenerated 00:02:00 1.2. Photoshop extensions We Need 00:07:00 2.1.how To Organize A Design Project 00:05:00 2.2 client's Sketches 00:04:00 2.2 naming psd layers and groups 00:05:00 2.3.naming Conventions To Help Developers 00:03:00 3.1.design Briefs 00:10:00 3.3 getting More Info On Project 00:05:00 3.4.content_template for gathering information 00:03:00 4.1.moodboards 00:06:00 4.2.ideation Phase 00:05:00 4.3.introduction To Balsamiq 00:10:00 4.4desining Wireframes Part 1 00:08:00 4.5.desining Wireframes Part 2 00:14:00 4.6.atomic Design 00:08:00 4.7.8pt Grid 00:09:00 5.1.typeface And Color Combinations 00:04:00 5.2.ui Style Guides 00:07:00 5.3.examples Of Ui Style Guides 00:03:00 5.4.how I Created My Style Guide 00:07:00 5.5.styleguide-typescale Explained 00:03:00 5.6.Styleguide-assignment 00:01:00 6.1.online tools for grid calcuations 00:13:00 6.2.planning your grid 00:05:00 6.3.whitespace-plan 00:06:00 6.4.setting Up Artboard For Desktop Design 00:07:00 6.5.designing Header And Hero Part 1 00:12:00 6.6 designing Header And Hero Part 2 00:09:00 6.7.designing Steps Area Part 1 00:10:00 6.8.designing Step Area Part 2 00:09:00 6.9.userreviews Area Design 00:09:00 6.10.adjusting White Space And Vertical Rhythem 00:06:00 6.11.desining Team Part1 00:11:00 6.12.desining Team Part2 00:07:00 6.13.footer Design Part1 00:08:00 6.14.footer Design Part2 00:11:00 7.1.Responsive Design Considerations Part 1 00:07:00 7.2.Responsive Design Considerations Part 2 00:06:00 7.3.Establishing Grid For Tablets 00:07:00 7.4.Header Area For Tablet View 00:11:00 7.5.Section how it work - steps 00:10:00 7.6.Section team Tablet View 00:09:00 7.7 footer Design 00:09:00 8.1.mobile Artboard And Grids 00:04:00 8.2.header Mobile View 00:11:00 8.3.steps Section-mobile 00:09:00 8.4.section 2 Team Members For Mobile 00:09:00 8.5.footer And Final Adjustments 00:08:00 9.1.what Developes Needs To Know 00:05:00 9.2.Red Line Document with Ink 1 00:10:00 9.3.Red Line Document with Ink 2 00:06:00 9.4.which layer styles you can use photoshop 00:08:00 9.5.installing Using Zeplin 00:10:00 9.6.style Guides With Zeplin 00:14:00 9.7.tools-zeplin-avocode-1 00:04:00 9.8.avocode And Sympli 00:06:00 10.1. What Are Prototypes 00:04:00 10.2.getting Familiar With Invision App For Prototyping 00:07:00 10.3.creating First Prototype With Invision App 00:06:00 11.1 using iconmoon app to create custom icon fonts set 00:08:00 11.2 Using SVG in Web design 00:11:00 Mock Exam Final Exam

Build the skills that make clients and employers say "Yes" with the WordPress for Beginners Mini Bundle—a launchpad into the creative and digital tech world. Whether you're a future freelancer, startup founder, or aspiring UI/UX pro, this bundle will make you job-ready, client-ready, and future-proof. Every successful digital creator has mastered the blend of WordPress, UX, CSS, JavaScript, and sales letter strategy. Now it’s your turn. Description The modern web doesn't run on design alone—it runs on people who understand WordPress, know how to shape a smooth UX, style with CSS, energize with JavaScript, and sell with compelling sales letters. With this bundle, you’ll stack the skills that turn a hobby into a hireable, scalable career. Agencies, brands, and startups are hiring faster than ever—but only if you come prepared. Learning WordPress, UX, CSS, JavaScript, and sales letter tactics positions you as the kind of talent they don’t want to lose to competitors. Opportunities don’t wait, and neither should you. This is the bundle that takes you from “I’m interested in web” to “I get paid to build it.” Build your skills, your portfolio, and your value—with WordPress, UX, CSS, JavaScript, and sales letter mastery all in one place. FAQ Do I need prior experience to take this bundle? Not at all. The WordPress for Beginners Mini Bundle is perfect for those just starting with WordPress, UX, CSS, JavaScript, and sales letter skills. What careers can this bundle lead to? Entry-level web developer, junior UI/UX designer, freelance web designer, digital marketing assistant, and more—roles where WordPress, UX, CSS, JavaScript, and sales letter skills are highly valued. Is now a good time to start learning? There’s no better time. The demand for professionals with WordPress, UX, CSS, JavaScript, and sales letter experience continues to rise—and this bundle puts you ahead of the curve.

Overview This comprehensive course on Develop 2D Game UI Using Inkscape will deepen your understanding on this topic. After successful completion of this course you can acquire the required skills in this sector. This Develop 2D Game UI Using Inkscape comes with accredited certification from CPD, which will enhance your CV and make you worthy in the job market. So enrol in this course today to fast track your career ladder. How will I get my certificate? You may have to take a quiz or a written test online during or after the course. After successfully completing the course, you will be eligible for the certificate. Who is This course for? There is no experience or previous qualifications required for enrolment on this Develop 2D Game UI Using Inkscape. It is available to all students, of all academic backgrounds. Requirements Our Develop 2D Game UI Using Inkscape is fully compatible with PC's, Mac's, Laptop, Tablet and Smartphone devices. This course has been designed to be fully compatible with tablets and smartphones so you can access your course on Wi-Fi, 3G or 4G. There is no time limit for completing this course, it can be studied in your own time at your own pace. Career Path Learning this new skill will help you to advance in your career. It will diversify your job options and help you develop new techniques to keep up with the fast-changing world. This skillset will help you to- Open doors of opportunities Increase your adaptability Keep you relevant Boost confidence And much more! Course Curriculum 5 sections • 19 lectures • 03:55:00 total length •Welcome to Game UI design with Inkscape!: 00:02:00 •The 3 Cs of good game UIdesign: 00:04:00 •What is HUD: 00:03:00 •Before youdraw SKETCH! !: 00:02:00 •Basic Button Bases: 00:18:00 •Aligning buttons: 00:04:00 •What makes a good icon: 00:04:00 •Very simple icons: 00:06:00 •More complex icons and drawing methods: 00:09:00 •Complex icons for a fantasy game: 00:20:00 •Creating an icon set for a ninja game: 00:19:00 •Space shooter UI design - Part #1: 00:18:00 •Space shooter UI design - Part #2: 00:18:00 •Fantasy game UI - Part #1: 00:20:00 •Fantasy game UI - Part #2: 00:19:00 •Fantasy game UI - Part #3: 00:16:00 •Fantasy game UI - Part #4: 00:12:00 •Gemstone game UI - Part #1: 00:21:00 •Gemstone game UI - Part #2: 00:20:00

Strength in Scenarios - Getting Meaningful User Feedback on Designs 'What do you think?' and 'How does this look?' are easy questions to ask when presenting users with potential design concepts, but they rarely give way to meaningful feedback. Using scenarios (workflow-based stories that provide a framework for getting user feedback) allows the user to give more honest, relevant feedback that's more closely related to the work they do on an everyday basis. It's essential to gather user feedback during all stages of an iterative design process and using scenarios to support design assessments works well within an Agile environment. In this workshop session, geared towards designers and product owners, we will explore what goes into creating meaningful scenarios and how they can be used. We will practice writing scenarios based on provided user workflows and paper prototypes. Scenarios can be a great tool in your toolbox for gathering requirements that your users will appreciate. Learning Outcomes: Write realistic scenarios that help users give meaningful feedback Discover the differences between what you see and what you hear Apply feedback and observations to refine designs

Strength in Scenarios - Getting Meaningful User Feedback on Designs 'What do you think?' and 'How does this look?' are easy questions to ask when presenting users with potential design concepts, but they rarely give way to meaningful feedback. Using scenarios (workflow-based stories that provide a framework for getting user feedback) allows the user to give more honest, relevant feedback that's more closely related to the work they do on an everyday basis. It's essential to gather user feedback during all stages of an iterative design process and using scenarios to support design assessments works well within an Agile environment. In this workshop session, geared towards designers and product owners, we will explore what goes into creating meaningful scenarios and how they can be used. We will practice writing scenarios based on provided user workflows and paper prototypes. Scenarios can be a great tool in your toolbox for gathering requirements that your users will appreciate. Learning Outcomes: Write realistic scenarios that help users give meaningful feedback Discover the differences between what you see and what you hear Apply feedback and observations to refine designs

Overview Uplift Your Career & Skill Up to Your Dream Job - Learning Simplified From Home! Kickstart your career & boost your employability by helping you discover your skills, talents and interests with our special Web Design with Adobe XD Course. You'll create a pathway to your ideal job as this course is designed to uplift your career in the relevant industry. It provides professional training that employers are looking for in today's workplaces. The Web Design with Adobe XD Course is one of the most prestigious training offered at StudyHub and is highly valued by employers for good reason. This Web Design with Adobe XD Course has been designed by industry experts to provide our learners with the best learning experience possible to increase their understanding of their chosen field. This Web Design with Adobe XD Course, like every one of Study Hub's courses, is meticulously developed and well researched. Every one of the topics is divided into elementary modules, allowing our students to grasp each lesson quickly. At StudyHub, we don't just offer courses; we also provide a valuable teaching process. When you buy a course from StudyHub, you get unlimited Lifetime access with 24/7 dedicated tutor support. Why buy this Web Design with Adobe XD? Unlimited access to the course for forever Digital Certificate, Transcript, student ID all included in the price Absolutely no hidden fees Directly receive CPD accredited qualifications after course completion Receive one to one assistance on every weekday from professionals Immediately receive the PDF certificate after passing Receive the original copies of your certificate and transcript on the next working day Easily learn the skills and knowledge from the comfort of your home Certification After studying the course materials of the Web Design with Adobe XD there will be a written assignment test which you can take either during or at the end of the course. After successfully passing the test you will be able to claim the pdf certificate for £5.99. Original Hard Copy certificates need to be ordered at an additional cost of £9.60. Who is this course for? This Web Design with Adobe XD course is ideal for Students Recent graduates Job Seekers Anyone interested in this topic People already working in the relevant fields and want to polish their knowledge and skill. Prerequisites This Web Design with Adobe XD does not require you to have any prior qualifications or experience. You can just enrol and start learning.This Web Design with Adobe XD was made by professionals and it is compatible with all PC's, Mac's, tablets and smartphones. You will be able to access the course from anywhere at any time as long as you have a good enough internet connection. Career path As this course comes with multiple courses included as bonus, you will be able to pursue multiple occupations. This Web Design with Adobe XD is a great way for you to gain multiple skills from the comfort of your home. Course Curriculum Introduction What You Will Find in This Course 00:02:00 Basic Concepts What Is Adobe XD 00:03:00 The Starter Version 00:02:00 How to Download Adobe Xd 00:02:00 Getting To Know the Program The Home Screen 00:04:00 The Workspace 00:04:00 Designing vs Prototyping in Xd 00:02:00 Your First New Document Creating a New File 00:03:00 Managing Artboards 00:03:00 Layers 00:03:00 Tools Overview 00:12:00 Plugins and Assets Adding And Managing Plugins 00:03:00 Plugins You Are Most Likely to Use in Your Designs 00:09:00 How To Use the Document Assets 00:03:00 Quick Introduction to Design Systems in Xd 00:03:00 Getting Ready to Start Designing How to Choose the Right Colors for Your Designs 00:04:00 5 Tools To Find the Right Colors for Your Layouts 00:07:00 How To Choose The Right Typeface for Your Website Designs 00:08:00 Best Practices Of Web Design 00:07:00 The Design and the Prototype Process The Project Overview 00:02:00 Let's Create a New File First 00:05:00 Finding the Right Colors for Our Design 00:04:00 Add the Colors and Fonts 00:06:00 Let's Add the Logo and the Navigation 00:04:00 Let's Prototype Our First Element 00:08:00 Let's Add the Active State and the First Hero Elements 00:05:00 Let's Start the Mobile Version of the Design 00:07:00 Let's Add the Mobile Menu 00:06:00 Let's Learn a Better Way of Animating the Menu Icon 00:11:00 Let's Add More Hero Elements 00:05:00 Let's Add the Social Media Icons 00:05:00 Let's Make the Hero Section Responsive 00:03:00 Let's Start the Services Section 00:04:00 Let's Add the Services 00:15:00 Let's Add the Call to Action Button 00:02:00 Let's Make the Services Responsive 00:10:00 Let's Start Adding the Portfolio Items 00:09:00 Let's Finish the Portfolio 00:08:00 Let's Make the Portfolio Responsive 00:07:00 Let's Add an Image Carousel 00:12:00 Let's Start Adding the Blog Section 00:05:00 Let's Start Adding the Blog Post Excerpts 00:13:00 Let's Set Up Blog Pages 00:12:00 Let's Learn Some Pagination Fx 00:08:00 Let's Set Up the Single Post Page and Finish the Section 00:08:00 Let's Add the About Me Section 00:11:00 Let's Add the Contact Me Section 00:13:00 Let's Add the Footer 00:09:00 Let's Make the Footer Responsive 00:02:00 The Finishing Touches 00:03:00 How To Share Your Project Sharing by Exporting 00:05:00 The Share Workspace 00:03:00 What File Formats You Should Use to Deliver the File to the Client 00:02:00 Summary Final Thoughts 00:02:00 Resource Resource - Web Design with Adobe XD 00:00:00