Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Wireframing For UI / UX Designers
Rating: 4.4 out of 5(49 ratings)
236 students

Wireframing For UI / UX Designers

Simplify your UI / UX process with paper and digital wireframes
Created byAleksandar Cucukovic
Last updated 5/2020
English
English [Auto],

What you'll learn

  • How to wireframe on paper
  • Wireframing supplies and techniques
  • Wireframing in online tools
  • Wireframing in Adobe Photoshop
  • Wireframing in Adobe Xd
  • Taking your wireframes further with images and prototyping

Course content

3 sections • 19 lectures • 2h 41m total length

  • What is wireframing2:15

    Wireframes bridge idea and code, enabling fast, cheap exploration on paper before production. They support team collaboration, test ideas easily, and avoid costly in-code changes.

  • Resources for paper wireframing3:32

    Discover flexible resources for paper wireframes, from blank paper to drawing books, pencils, and markers. Learn that wireframes are a simple, quick starting point you can iterate on before software.

  • Wireframe elements2:52

    Explore the core wireframe elements—text, images, buttons, and forms—and how to combine them. Use quick sketches and paper frames to convey ideas to clients before moving to software.

  • Wireframe Styles8:51

    Explore a range of wireframe styles for ui/ux design, from simple sketches to multi-element layouts, and learn how to convey text, images, buttons, and fields to clients and teams.

  • Printable Templates12:08

    Explore printable templates for wireframing in ui/ux design, including iPhone, Samsung Galaxy, browser, and Apple Watch templates, plus blank sheets to bridge ideation and execution.

  • Drawing your wireframe12:38

    Design a basic iPhone wireframe using three screens to map a social feed, profile, and navigation, including a home screen, posts, icons, and a bottom tab bar.

Requirements

  • Pen and paper for paper wireframes
  • Adobe Xd. You can download it from Adobe's website.
  • For Windows users Windows 10. Adobe Xd does not work in Windows 7 or 8.
  • No previous Adobe XD experience required.
  • There is no coding in this course. If you are looking to code, please avoid this course.
  • Links to other software are provided but you are not required to use them

Description

Wireframes are important part of any design process because they are the bridge between the idea and the execution.


They are great because they are simple enough so everybody involved can understand them, and also cheap enough because you can create them on the piece of paper or majority of design software.


Hi there my name is Alex and in this course you will learn:

  • What are wireframes

  • How to draw wireframes on paper and use the templates i provided

  • How to create wireframes in different online tools

  • How to create them in Photoshop

  • And finally, how to create them in Adobe Xd and then move on to high fidelity wireframes and prototypes.


This course is for anybody interested in wireframes and you don't have to know how to use these tools, we are going to cover them in this course.


So if you want to improve your productivity, save a lot of time and money on iterations and create products faster, then click enroll and i'll see you in the course.


Have a creative day!

Alex

Who this course is for:

  • Anyone interested in wireframing
  • Anyone interested in UI / UX design
  • Anyone interested in Adobe Xd and it's lightning speed
  • Beginners and newbies, looking to expand their knowledge
  • Designers looking to switch to UI / UX
  • For anyone who needs a UI / UX design experience in their portfolio
  • Designers who want to make user focused designs

Report abuse