Modern Web Design Diploma - John Academy

7/12/2018

Modern Web Design Diploma - John Academy

LOGIN

HOME / COURSE / DESIGN / MODERN WEB DESIGN DIPLOMA

Modern Web Design Diploma ( 7 REVIEWS ) 

379 STUDENTS

Description The course teaches you to develop and design a responsive website that will work on every device covering mobile, …

TAKE THIS COURSE

£249.00 £14.00

1 YEAR

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

  1/15

7/12/2018

Modern Web Design Diploma - John Academy

LEVEL 3 - DIPLOMA COURSE BADGE COURSE CERTIFICATE

   63

NUMBER OF UNITS NUMBER OF QUIZZES

0

7 HOURS, 38 MINUTES





HOME







CURRICULUM

REVIEWS

Description The Modern Web Design Diploma course teaches you to develop and design a responsive website that will work on every device covering mobile, tablet to extra large desktop monitor.

The number of mobile users is enormous and increasing day by day. Therefore, it is a must to make your websites responsive. The old website owners spend a lot to make their site responsive; some go for redesigning and remaking their sites. Throughout the course, you will learn to create the responsive webpage using Balsamiq Mockups, Photoshop, Zeplin and Invision App. You will learn how to design for the developers.

Topics covered in the course are the system of building Prototypes for showing website ows 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 di erent screens, e.g. PC, Tablet or Smart Phones.

Assessment: Web Designer UI Designer Web Developer Graphic Designer Creative Director Project Managers Frontend Developers https://www.johnacademy.co.uk/course/modern-web-design-diploma/

2/15

7/12/2018

Modern Web Design Diploma - John Academy

Certi cation: After completing and passing the course successfully, you will be able to obtain an Accredited Certi cate of Achievement.

Certi cates can be obtained either in hard copy at a cost of £39 or in PDF format at a cost of £24.

Who is this Course for?

Introduction to Baking Diploma is certi ed by CPD Quali cations Standards and CiQ. This makes it perfect for anyone trying to learn potential professional skills.

As there is no experience and quali cation required for this course, it is available for all students from any academic background.

Requirements Our Introduction to Baking Diploma is fully compatible with any kind of device. Whether you are using Windows computer, Mac, smartphones or tablets, you will get the same experience while learning. Besides that, you will be able to access the course with any kind of internet connection from anywhere at any time without any kind of limitation.

Career Path After completing this course you will be able to build up accurate knowledge and skills with proper con dence to enrich yourself and brighten up your career in the relevant job market.

COURSE CURRICULUM

Introduction



0.1 promo-work ow



00:03:00



0.2 what we will cover in this course



00:03:00

Requirements to take this course



1.1 skills-and-apps-you-need-to-take-this-courseautogenerated



00:02:00



1.2. Photoshop extensions We Need



00:07:00

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

3/15

7/12/2018

Modern Web Design Diploma - John Academy

Organizing your Web Design Project



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:06:00



2.3.naming Conventions To Help Developers



00:03:00

Gathering project information from client



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

Sketching, Wireframing, Atomic Design & 8point Grid system



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

Style Guides, colors and typographics scales

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

4/15

7/12/2018

Modern Web Design Diploma - John Academy



5.1.typeface And Color Combinations



00:04:00



5.2.ui Style Guides



00:08: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

Designing for Desktop/Large View (Wstudio Web Design Project)



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

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

5/15

7/12/2018

Modern Web Design Diploma - John Academy



6.12.desining Team Part2



00:07:00



6.13.footer Design Part1



00:08:00



6.14.footer Design Part2



00:11:00

Planning Responsive Web Design



7.1.Responsive Design Considerations Part 1



00:07:00



7.2.Responsive Design Considerations Part 2



00:06:00

Designing for Tablet/Medium View (Wstudio Web Design Project)



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

Designing for Mobile/Small View (Wstudio Web Design Project)



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

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

6/15

7/12/2018

Modern Web Design Diploma - John Academy

Designing for Developers



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

Prototyping with Invision app



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

SVGs and Icon Fonts in Web Design



11.1 using iconmoon app to create custom icon fonts set



00:08:00



11.2 Using SVG in Web design



00:10:00

Mock Exam Final Exam

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

7/15

7/12/2018

Modern Web Design Diploma - John Academy

COURSE REVIEWS

4.8   7 ratings

5 STARS

0

4 STARS

0

3 STARS

0

2 STARS

0

1 STARS

0

NO REVIEWS FOUND FOR THIS COURSE.

RELATED COURSES

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

8/15

7/12/2018

Modern Web Design Diploma - John Academy

Diploma in UI Design

£249.00 £14.00  

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

327

9/15

7/12/2018

Modern Web Design Diploma - John Academy

Diploma in Adobe XD Design

£249.00 £14.00  

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

317

10/15

7/12/2018

Modern Web Design Diploma - John Academy

Level 3 Diploma in Typography for UI Designers

£249.00 £14.00 397

 

379 STUDENTS ENROLLED

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

11/15

7/12/2018

Modern Web Design Diploma - John Academy

CERTIFICATION

ACCREDITED BY

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

12/15

7/12/2018

Modern Web Design Diploma - John Academy

CENTRE APPROVED BY

Registered with the UK Register of Learning Providers (UKRLP) UKPRN: 10063816

COURSE PARTNERS

https://www.johnacademy.co.uk/course/modern-web-design-diploma/

13/15

7/12/2018

Modern Web Design Diploma - John Academy

ABOUT We are a company who is best known for o ering awarding body accredited courses for anyone who wishes to take their professional life to the next level.  11 Floor, 15 St Botolph Street, London EC3A 7BB  020 3744 3990  info@johnacademy.co.uk CERTIFICATE CODE Enter Certi cate Code

VALID ATE

IMPORTANT LINKS https://www.johnacademy.co.uk/course/modern-web-design-diploma/

14/15

7/12/2018

Modern Web Design Diploma - John Academy

About Us FREE CV REVIEW For Business Redeem Voucher Terms & Conditions Privacy Policy Cookie Policy FAQ Contact FREE CV REVIEW

© JOHN ACADEMY.



https://www.johnacademy.co.uk/course/modern-web-design-diploma/







15/15