We may earn an affiliate commission when you visit our partners.

Draw a wireframe in Pencil Project

In this 2 hours long guided project you will learn how to create an e-commerce web UI wireframe using Pencil Project. You will create a user interaction and navigation flowchart, sketch re-usable items like header and navigation, group and arrange them into private collections, create home and product page, design dialogue and error messages, link the elements and finally export the prototype in an image, PDF or clickable interactive web format.

Enroll now

Or subscribe to Coursera Plus

And get unlimited access to Coursera

What's inside

Syllabus

Project Overview

In this 2-hour-long guided project you will learn how to create an e-commerce web UI wireframe using Pencil Project. You will create a user interaction and navigation flowchart, sketch re-usable items like header and navigation, group and arrange them into private collections, create home and product page, design dialogue and error messages, link the elements and finally export the prototype in an image, PDF or clickable interactive web format.

Good to know

Know what's good

, what to watch for

, and possible dealbreakers

Thoroughly examines user interaction design, which is standard in web development

Guides learners through designing re-usable elements and navigation, which are core UI design principles

Teaches e-commerce UI design concepts, which are highly relevant in the tech industry

Provides hands-on practice with real-world UI design principles and tools

Projects include exporting prototypes in a variety of formats, which is useful for different situations

Taught by Angelo Paolillo, an industry expert in UI design

Save this course

Save Draw a wireframe in Pencil Project to your list so you can find it easily later:

Save

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Draw a wireframe in Pencil Project with these activities:

Compile Notes and Resources

Show steps

Gather course materials, notes, and resources to prepare for the upcoming UI wireframing course.

Browse courses on Wireframing

Show steps

Review course syllabus and instructor bio
Create digital folders for course materials
Set aside time for note-taking

Design a Basic E-commerce Web Page Wireframe

Show steps

Apply your wireframing skills to create a basic e-commerce web page wireframe, strengthening your understanding of the process.

Show steps

Gather inspiration and references
Sketch out the layout and structure
Create the wireframe using Pencil Project

Attend a UI/UX Design Workshop

Show steps

Deepen your understanding of UI/UX design principles and wireframing techniques by attending a dedicated workshop.

Browse courses on User Experience Design

Show steps

Research and identify relevant workshops
Register and prepare for the workshop
Actively participate and take notes

Show all three activities

Career center

Learners who complete Draw a wireframe in Pencil Project will develop knowledge and skills that may be useful to these careers:

UX Designer

UX Designers focus on the user experience of websites and applications. They research user needs, create user flows, and design interfaces that are both usable and enjoyable. This course can help UX Designers learn how to use Pencil Project to create wireframes, which are essential for visualizing and communicating design ideas. The course also covers topics such as creating prototypes and gathering feedback, which are essential for improving the user experience.

See salaries and explore the career path for UX Designer

UI Designer

UI Designers create the visual interfaces for websites and applications. They collaborate with UX designers to ensure that interfaces are both visually appealing and easy to use. This course can help UI Designers learn how to use Pencil Project to create wireframes, which are essential for planning the layout and functionality of an interface. The course also covers topics such as creating user flows and linking elements, which are critical for creating user-friendly experiences.

See salaries and explore the career path for UI Designer

Web Developer

Web Developers are responsible for developing and maintaining websites and applications. They work with UI and UX designers to implement designs and ensure that websites and applications function properly. This course can help Web Developers learn how to use Pencil Project to create wireframes, which can help them to better understand the design of a website or application before they begin coding. The course also covers topics such as creating prototypes and linking elements, which can help Web Developers to create more efficient and effective websites and applications.

See salaries and explore the career path for Web Developer

Information Architect

Information Architects design and organize the structure and content of websites, intranets, and other digital environments. They work with UI and UX designers to create information systems that are easy to navigate and use.

See salaries and explore the career path for Information Architect

Software Developer

Software Developers design, develop, and maintain computer software. They work with UI and UX designers to create software that is both functional and user-friendly.

See salaries and explore the career path for Software Developer

Product Designer

Product Designers are responsible for the overall design and development of digital products. They work with UI and UX designers, engineers, and other stakeholders to create products that meet the needs of users. This course can help Product Designers learn how to use Pencil Project to create wireframes, which can help them to visualize and communicate their design ideas. The course also covers topics such as creating user flows and prototypes, which can help Product Designers to create more effective and engaging digital products.

See salaries and explore the career path for Product Designer

Interaction Designer

Interaction Designers focus on the interactions between users and digital products. They design gestures, animations, and other elements that make digital products more engaging and intuitive. This course can help Interaction Designers learn how to use Pencil Project to create wireframes, which can help them to visualize and communicate their design ideas. The course also covers topics such as creating user flows and prototypes, which can help Interaction Designers to create more effective and engaging digital products.

See salaries and explore the career path for Interaction Designer

Sales Manager

Sales Managers lead sales teams and develop sales strategies to achieve sales goals. They work with UI and UX designers to create sales materials that are both persuasive and effective.

See salaries and explore the career path for Sales Manager

Business Analyst

Business Analysts analyze business needs and develop solutions to improve business processes. They work with UI and UX designers to ensure that solutions are both effective and user-friendly.

See salaries and explore the career path for Business Analyst

Technical Writer

Technical Writers create instruction manuals, technical reports, and other documentation to explain complex technical information. They use clear and concise language to help users understand how to use products or services.

See salaries and explore the career path for Technical Writer

Customer Success Manager

Customer Success Managers ensure that customers are satisfied with products and services. They work with UI and UX designers to create customer support materials that are both helpful and easy to use.

See salaries and explore the career path for Customer Success Manager

Project Manager

Project Managers plan and execute projects to achieve specific goals. They work with UI and UX designers to ensure that projects are completed on time and within budget.

See salaries and explore the career path for Project Manager

Marketing Manager

Marketing Managers develop and execute marketing campaigns to promote products and services. They work with UI and UX designers to create marketing materials that are both visually appealing and effective.

See salaries and explore the career path for Marketing Manager

Quality Assurance Analyst

Quality Assurance Analysts test software to identify and fix bugs. They work with UI and UX designers to ensure that software is both functional and user-friendly.

See salaries and explore the career path for Quality Assurance Analyst

Graphic designer

Graphic Designers create visual concepts, using computer software or by hand, to communicate ideas that inspire, inform, and captivate consumers. They develop the overall layout and production design for various applications such as brochures, magazines, and corporate reports.

See salaries and explore the career path for Graphic designer

Reading list

We've selected ten books that we think will supplement your learning. Use these to develop background knowledge, enrich your coursework, and gain a deeper understanding of the topics covered in Draw a wireframe in Pencil Project.

Sketching User Experiences: The Workbook

Save

Emphasizes the importance of sketching and rapid prototyping in the design process.

Draw a wireframe in Pencil Project

What's inside

Syllabus

Good to know

Save this course

Activities

Career center

Reading list

Share

Similar courses