Extensible Python: Robustness through Addition - PyCon 2024
Wireframing and the user experience
1.
2. What is it?
Wireframes are basic visual guides
They describe the content and functionality without
design
They are very useful in working out the user
experience an journey of a site without design
3.
4. What to include
Placement’s for content with descriptions. You can
use things like CTA to describe the visuals.
Point out functionality where needed
Show when there are images and text
5. Think about how people
read online
Generally people read websites left to right top to
bottom.
You can change how read down your website but
placing more weighting on different areas
In you wire framing you have the chance to try many
ways of laying out content to try it! Its much easier to
get it right now, rather then later.
6. F-shape theory
Formed from eye-tracking
First Horizontal movement
Then down a bit and second horizontal movement
Then Finally a left hand side vertically
8. What to learn from F
Users won’t read your text completely
The first two paragraphs must contain your most
important information
9. Copy
Online you need to dumb everything down the plain
English
People don’t pay attention online, unless they are
committed to site. (they will just scan for what they
want and look for keywords.)
If you site has a lot of copy (like news and blogs)
then make ways for people to work out if they want
commit or not
10.
11. Wire framing tips
Try different solutions on paper
Keep in mind different users, and what their
approaches may be
The wireframe isn’t the design, don’t feel like your
committing to much to the layout.
Form a priority order for the content
