Loup County, Nebraska Website
Information Architecture
Information architecture focuses on creating effective designs by organizing, labeling, and structuring content properly. Designers use this by considering who they are talking to, what information they are giving, and how the user will interact with the content. Websites have good information architecture when users are able to easily navigate the website and they can easily move around it. There are three types of information architecture that are popular to use. Hierarchical. matrix, and sequential. Hierarchical is simply organized by level of importance. The designer either uses size, color, or contrast to show its importance over other information and to grab the users attention. Matrix leaves navigation up to the user. They can choose what they want to view and in what order they view things. Sequential is a step by step path created by the designer, for the user to go through to view to site or accomplish a task.
Typography on the web
Typography has a strong influence on websites. It can be used to pull in user's attention and it can show what kind of message the designer is wanting to give off. Typography is the creative design of text on a web page. Designers use typography to design by how many typefaces they use, what kind of hierarchy they create with it, the use of serif or sans serif fonts, the sizes, the colors, the spacing, and the amount of text per section. Below are some examples of creative use of typography in web design.
Good examples of informational sites
Bad examples of informational sites
Sketches
Wireframes
User flowchart
Scenarios:
1. You need to vote but you don't know where to go, use the website to find out where the voting precinct is located.
2. You need to renew your license, use the website to find the hours and locations where you can take a written driver's test.
3. You are working on a history project of your town, use the website to find old pictures of your town.
4. You want to build a gazebo in your backyard, use the website to apply for a builder's permit.
usability tests
Usability testing for scenario 1. The user thought that this flowed really well and he liked that the information on where the voting precinct was, was right on the main screen.
Usability testing for scenario 2. The user though that it made sense to add a link to the dmv website so this way the user could get additional information that they may need without having to open a new tab.
Usability testing for scenario 3. The user did not like how the gallery was randomly placed. He suggested having the gallery be 3x3 so that it is more unified and clean looking. He also said there should be a button to download files so that users can get the pictures easily.
Usability testing for scenario 4. The user really liked how this page was set up. He suggested adding a button to schedule times along with the application. I am not sure how this works, so I will have to search it so I can design it best.
Refined wireframes
usability testing
Desktop and mobile
I did usability testing for scenario 1. I need to add location information and other information still. I have learned that the original design isn't that strong and that I have a lot of work to do.
Logo
Final Designs
Mockups
Project Brief
"You will be redesigning the website for Loup County, Nebraska. The existing website is here: http://www.co.loup.ne.us/ (Links to an external site.). Your site must enable visitors to search for and find information about specific topics that county residents would typically need. You’ll need to ensure that busy citizens who visit your site can easily find specific information, and that the typography you employ is both easy to read and aesthetically pleasing."
Usability testing helped me find the best design solutions. I was able to adjust information and images in interactive ways that was pleasing to the eye. It also helped me see design flaws that I was blind to. I found that I thought my design was good until a user pointed out issues.
link to working prototype
https://xd.adobe.com/view/b43b0451-c40d-4820-9ca9-f380896ce69b-e168/
link to video presentation
https://www.loom.com/share/3ae93e2180e7447e88d5a7184d022adf
