Tag: wireframe

When constructing a website something you need to understand is that it’s just like building anything else and that you need to plan it out.

A wire frame is like a blueprint for your new sites. Without a blueprint for anything, then there’s no direction and if there’s no direction then there’s nothing to build, you cannot build without any form of direction. Without a wireframe the website will be a mess, and that’s uncool. So plan always.

Wireframing digitally VS traditionally

When it comes to wireframing you can do it with on a device or on pencil (not pen don’t be a neanderthal) and paper, or a board. Personally I don’t think it really matters which one you use because all that matters is what you’re comfortable using. I’m more of a pencil and paper type of guy so everything that I do starts out on literal paper and digitized later.

Wireframe tools

There are so many wireframe tools out there. Some costs money but some are also free to use. Here’s a few programs that you can use that wont cost you anything.

• Lucidchart: you will have to sign up first but you can use the free version. Paying for it gives you more options on the site but we don’t need that if all we are doing is just very few things like wireframing.
• Framer: it’s another site you have to sign up for, but you can still use the site to wireframe without paying for any memberships.
• Wireframe.CC: It’s like writing on pencil and paper. It’s simple to use and you don’t have to buy a premium for that. However, it does lack mock-up creation, prototyping, and screen capture. So while it is simple to use, it does lack complexity.
• Figma: Is a cloud based platform great for sharing and collaboration with team members. It’s free but for only two members and on three projects at a time.
• Pencil project: It’s all FREE! Diverse UX tool, good amount of interactive elements, and especially known for it’s diagramming capabilities, linking shapes, wireflows, and other flowcharts is made quick and easy with Pencil Project’s “connector” tool and linking page. But because it’s free there are things this program lacks, like the good collaboration features, and the shapes are a bit lighter than other programs.

And that people, is how wireframing works. Remember, always construct a blueprint before doing any project otherwise you’ll be dealing with an absolute mess.