Aidan Mulcahey, Heroku: https://a3-aidanmulcahey.herokuapp.com
- Hey everyone my name is Aidan Mulcahey and I made an application that allows a user to make an account with a username and password Technical and Design achievements are below.
- The goal of this application is to login into your account and post messages to ask questions about your unemployment claim. In a much better version of the website, the idea is your questions will be answered eventually by a representative.
- Some of the challenges I faced when making this application was first coming up with an idea for this project, and then the real diffculty came when trying to save the data. Also making multiple pages was time consuming and I wanted to make sure there were no bugs, which testing took a while. Getting the scores to 90 on Google Lighthouse as well was also a challenge. Here is how my site was ranked: Performance: 99 Accessibility: 95 Best Practices: 83 SEO: 100
- The authentication strategy I used was a username and password. For my user to login the information is: (using mongodb)
- Username: 123456789 Password: 12345
- The CSS Framework I used for this application was bootstrap.
- express.json for data formatting
- express.static for serving static files
- cookie-session for storing login information and unemplyoment question(s) data
- body-parser for processing data in an HTTP request body
- errorhandler for help with errors.
- username and passsword with dummy account (OAuth authetication), Username: 123456789 Password: 12345 (10 points)
- Hosted my site on Heroku. I liked it, very straight forward, linked it with Github account and had no issues.
- in my opinion Glitch was so much slower than Heroku. (5 points)
-
The CRAP Principles (5 points)
- Contrast
In my website I was able to showcase a vibrant use of colors. As the main background I picked purple because that is my favorite color and wanted it to have the most emphasis. As it relates to the principles I learned it is important to grab the user’s attention and I believe I achieved that with this website. The colors pop out, and although maybe in a professional sense it may not be the best idea to have purple as the main color for the display page for state unemployment but overall in the scope of this class and the posted requirements it is nice to see. The buttons are made using bootstrap and look stylish as the user logs into their account as well.
- Repetition
The repetition factor I was able to capture in my application was the data storage factor and how it was ultimately displayed on screen using the same fonts. The user puts in a question or concern into the forum and it returns the message lower on the page. You can then modify or delete the question, but what is important is the site is consistent in how it displays this information. It is not a mess, which is a very key aspect to a successful website. The same font being used throughout is important because consistency means professionalism. The user should want consistent results and know what they are looking at. Besides that, repetition when done right can be very beneficial for a website’s appearance and functionality.
- Alignment
Everything in the application seems to be aligned. The buttons are formatted correctly and presented in a neat fashion. It is important factor to organize the information neatly so it looks professional and visually pleasing. I did this so when user’s input a question about their unemployment claim they feel comfortable knowing it is being handled by trained professionals and actually will receive a response. In the worst case when things are actually not in fact aligned on the page, one will lose faith in the integrity of the application and most likely will not continue using it. Alignment is very important during the final stages of an application, which I learned first hand. A website at the end of the day needs structure, and alignment is that structure.
- Proximity
I used proximity to make it easier to access the page. The buttons are next to each other in an effort to make it much easier to click on. Proximity was very important when designing this application and I realize that proximity can be overdone. Having things to close to each other, for example buttons, can lead the user to clicking things he/she may not have intended to. Spacing things out but making sure the page is not hard to follow is the difference between an okay website and a great one. Making it look professional and easily accessible makes proximity an essential aspect of application design. Without proximity, it could be hard for user’s to access all different features of the website and they may not fully use all desirable functions of the application.