One of our products, SMS Pro™, is web-based aviation safety software. SMS Pro has a configurable login form that allows users to securely access the system. We recognize the importance of functionality, usability as well as aesthetic desirability. As a website designer, I have to balance all of them together in order to meet a great user’s experience.
Images are helpful during the design process, but they need to used properly. What does that mean? It means that when we have an image, such as from your camera, we can’t haphazardly upload it next to text on our login form. We have to think and choose wisely.
The following are steps a professional Web designer takes to modify an existing SMS Pro site.
The following are steps a professional Web designer takes to modify an existing SMS Pro site.
Existing Web Site Design
What would I like to change?
1. The image looks nice but it needs some work before using it. I’d like to remove the person who stands right in front of the plane. This task would take about 20-30 minutes with Photoshop so why not? The image without the person there makes it less distracted. Next, I would not use a border surrounding the image because if it doesn’t help to make it looks better I’d rather just leave it alone. One of my principles of design – less is more.
2. A couple more things I would like to do are adjusting the color tone and crop the image. So this way I have the plane in focus more than clouds. Then put the image on top of the page.
3. The logo and login form do not stand out and they don't seem connected. I’d like to group them together to make them stand out more. I'd put them on the grey background (same tone with the sky.) Also change character of word “username” and “password” with uppercase and increase the size.
Change text color to be dark grey since it match with the login background color.
4. Increase the size of text box including the login button.
5. Change the word “Retrieve password” to be “Forgot your password?” and move it next to login button.
6. Move the Facebook button away from the middle of the screen.
7. Add welcome text under the logo to inform users this is their safety system, and it helps to direct users’ eyes to the login form.
How about a second Web design idea for the Login page?
I like the first design better than the existing login form but I like this one even more.
1. I change image since the previous plane faces outward so it leads users’ eyes out from the page. With this image, it helps keep users engaged within the page.
2. The background color changed to be the same tone with plane background (faded more.)
3. The logo looks bigger since it has more white space.
4. The welcome text has more room for larger size and becomes the title of the page.
One of our cultures is excellent customer support. I’m happy that I can help improve SMS Pro™ to serve our clients better. In conclusion, exceptional Web design is about whether the client likes the concept. So, which one do you like better?
About NWDS -
founded in 2003 by six software engineers, NorthWest Data Solutions
(NWDS) provides custom computer programming and systems design services.
NWDS creates many types of software, including e-commerce, financial,
defense, engineering, logistics, aviation and more. www.nwds-ak.com
