Web Design Wireframes to Prototypes
Join the Web Design: Wireframes to Prototypes online course by Coursera to learn the application of early UX research to tangible user interfaces and more.
Intermediate
Online
5 Weeks
3,369 INR Quick Facts
| Medium Of Instructions | Mode Of Learning | Mode Of Delivery |
|---|---|---|
| English | Self Study | Video and Text Based |
Course Overview
The Web Design: Wireframes to Prototypes certification course by Coursera is the continuation of the Web Design: Strategy and Information Architecture course and is the final course in the UI/UX Design Specialization offered by Coursera. In this programme, you will gain knowledge about creating wireframes, high-fidelity mockups, as well as clickable prototypes.
Created in collaboration with the California Institute of Arts, the Coursera Web Design: Wireframes to Prototypes online course brings to you a design-centric approach for user experience (UX) design and user interface (UI). It offers skill-based, practical instructions and a visual communications perspective, rather than being focused on programming or marketing alone.
Furthermore, the Coursera Web Design: Wireframes to Prototypes training is a self-paced learning course, built for the convenience of students, that allows them to learn at their own speed and from the comfort of their own space. The students can also earn a shareable certificate after completing the course successfully.
The Highlights
- Flexible deadlines
- Free enrolment
- 100% Online
- Self-Paced course
- Intermediate level
- Approximate completion in 27 hours
- Shareable Certificate
- Hands-on Projects
- Subtitles in English
Programme Offerings
- online learning
- Flexible Deadlines
- Sharable certificate
- Graded Assignments
- Graded Quizzes
- peer feedback
Courses and Certificate Fees
| Certificate Availability | Certificate Providing Authority |
|---|---|
| yes | Coursera |
Web Design: Wireframes to Prototypes Fee Structure:
Description | Amount |
Fee for 1 month | Rs. 1,676 |
Fee for 3 months | Rs. 3,369 |
Fee for 6 months | Rs. 5,029 |
What you will learn
Upon completion of the Coursera Web Design: Wireframes to Prototypes certification syllabus course, you will have:
- Knowledge of responsive web design, along with mobile web challenges
- Understanding of a mobile-first approach
- Overview of the different cloud service models like IaaS, PaaS, SaaS, as well as deployment models (Public, Private, Hybrid)
- Understanding the relationship between programming and design
- Basic knowledge of the different web technologies that make the web work and include HTML, JavaScript, CSS, server-side coding, as well as databases
- Hands-on experience at Adobe XD, Adobe Illustrator, sketch and Balsamiq.
Who it is for
The Web Design: Wireframes to Prototypes online course will be suitable for the following individuals:
- Those who want to sharpen their analysis and visual design skills for UX and UI, and be web developers.
- Those with some experience in front-end, back-end web development
- Those who wish to build a skill set in UX or UI for web designing and app designing.
Admission Details
To apply to the Web Design: Wireframes to Prototypes classes course online course by Coursera, you can follow the given steps:
- Open the official website of Coursera- https://www.coursera.org/.
- Search for ‘Web Design: Wireframes to Prototypes course’.
- Now, click on the ‘Enroll for FREE’ button.
- A dialogue box will pop up asking you to sign up/sign in to Coursera.
- If you already have an account, use those details to log in and continue or else sign up using your email id.
Application Details
Joining the Coursera Web Design: Wireframes to Prototypes course, requires you to sign up on the website using your Email ID and password. Once done, you will be eligible to join the course.
The Syllabus
Videos
- Course Introduction
- Why Peer Review?
- Peer Review Tips
- How to apply feedback
Readings
- About this course
- About the assignments
- Project Brief
- Required tools
- Academic Integrity
- About CalArts and the Program in Graphic Design
- What is peer review?
- Instructor Presence and Staff Support
- Forum Guidelines
- Requesting Peer Reviews
Videos
- Introduction to Week 1
- Introduction to Wireframes
- Responsive Design: What size should your website be?
- Introduction and Primary navigation
- Secondary and utility navigation
- Related content, inline links, indexes, and search
- Wayfinding
- Header
- Footer
- Sidebar
- Content
- Common Form Elements
- Introduction to Homepage Content Strategies
- Examples of Homepage Content Strategies
- Wireframing Tools
- Wireframes: Bradley
- Wireframes: Alyson, part 1
- Wireframes: Alyson, part 2
Readings
- Example Wireframes: Pasadena Conservatory of Music
- Scrolling
- Further Reading
- Try it yourself: Sketch out a wireframe
- A Final Thought for the Week
Assignments
- Navigation Systems
- Common Design Patterns
Peer Review
- Wireframes
Videos
- Introduction to Week 2
- Visual Mockups
- Design Principles
- What is whitespace?
- Using whitespace to style a form
- A visual comparison
- Web Fonts
- Web Typography: A few tips
- Creating Visual Mockups
- Moodboards and Homepage Mockup: Bradley
- Homepage Mockup: Alyson
- Interview with Rob Hope: Web design trends
Readings
- The Grid
- Further Reading
- Web History, Skeuomorphs & Flat Design
- Moodboards
- More from Rob Hope: EBook on Landing Page Hot Tips
- A Final Thought for the Week
Assignments
- Design Principles/Whitespace
- Web Typography
Peer Review
- Visual Mockups: Home Pages
Videos
- Introduction to Week 3
- Do I Need to Learn How to Code?
- Survey of Web Technologies
- HTML vs. CSS vs. Javascript: A metaphorical adventure6m
- HTML Basics
- CSS Basics
- Web Inspector
Readings
- A Web Design History Primer
- How to become a unicorn
- Try it yourself: Styling Buttons
- Further "Reading"
- A Final Thought for the Week
Peer Review
- Visual Mockups: Full Set
Videos
- Introduction to Week 4
- Clickable Prototypes Introduction
- Invision Introduction
- Exporting Assets
- Importing Assets and Creating Hotspots
- Hotspot Templates
- Full Mockups: Bradley
- Full Mockups: Alyson
Readings
- Dark Patterns
- A Final Thought for the Week
Peer Reviews
- Final Project Submission
- Clickable Prototype of Mockups
Discussion Prompt
- Dark Patterns
Instructors
CalArts Frequently Asked Questions (FAQ's)
For this particular course, it is ideal to have some experience in graphic or visual design, along with some experience with human-computer interaction and front or back-end web development.
As this is a graphic design course, students will need access to a desktop computer or laptop with the appropriate software installed. Adobe CC software is required for these courses, but if not available, you can use other available alternatives as well.
The UI / UX Design Specialization consists of 4 courses namely UI / UX Design Specialization, Web Design: Strategy and Information Architecture, UX Design Fundamentals, and Web Design: Wireframes to Prototypes.
Yes, Coursera helps students who cannot afford the fee for the specialization by providing financial aid. You can apply for financial aid at the time of enrolling or later on in the course, by filling out an application and waiting for approval.
The average rating or stars that are given by the consumers are 4.9 out of 5.