Bank Loan Helper Application

1
Bank Loan Helper Application
CSCI-588 Specification and Design of User
Interface Software Assignment 6

• By
• Team 5
• Amrit Pal Singh
• USC ID 7169-4618-78
• Kunal Jain
• USC ID 8513-4600-93
• Prathima Naidu
• USC ID 1971-1660-18
• (on Campus Students)

2
Project Description

• Banking application that provides information
  about the banks that are best suited for the
  users purpose
• Services provided Various types of loans,
  Deposit, Remittance
• Factors considered for theses services are
• Credit History
• Source of Income
• Many more
• Searches the database to provide the names of
  banks based on users criteria
• Compares them using the calculator to check which
  banks fit the users need
• Returns the list of all those banks matching the
  given criteria
• Assumptions
• Providing consolidated information of various
  services provided by the banks according to users
  criteria
• Existing systems provide the services on their
  own and doesnt provide information about other
  institutions
• User is willing to disclose his / her personal
  information online
• Banks are willing to share information of the
  services provided by them

3
System Requirements

• Browser is required
• Session expiration
• Idle time out
• Search capability
• Login facility for returning users
• Signup page for new user
• Feedback form for the user application
• Customizable search results
• Google API for exact location distance

4
Site Map
5
User Profile
6
Dialogue/Interaction Styles
7
Task Analysis
8
Environment in which system operates I/O
Devices

• Usage Environment
• Most of the time
• At home
• May be
• In office
• Working alone
• Working with someone
• Hardware selected
• Input device
• Key board
• Form filling
• Question Answer
• Mouse
• Menu Selection
• Basic Navigation
• Output devices
• Monitor
• Display

9
Style Guide

• PAGE DESIGN
• Consistency maintained across pages
• Less vertical no horizontal scrolling
• Application works across all browsers and all
  hardware platforms
• HOME PAGE
• Main Application Window Elements
• Header and footer remains consistent
• Menu bar provided to help in navigation
• Home Page provides brief introduction to the
  various services

10
Style Guide (contd.)

• Colour
• Application has consistent white background with
  blue and black color fonts
• Menu and controls are blue
• Data field has white background with black text
• Menu General Guidance
• Pull down menu is used through out
• Fill in forms used for taking information from
  the user
• Message Window Type
• Errors highlighted while filling the forms

11
Icons and symbols used

• Limited icons used
• Icons are general and are memorizable
• Home icon
• Contact-Us icon
• Site Map
• Application uses more of forms menus

12
Main Screen Page Design

• Architecture and Navigation
• Navigation is made easy by giving tabs
• Site map provided to make the site navigation
  clearer
• Layout design
• Home page is designed for ease of use
• Layout is consistent through the website
• Graphics
• Graphics usage is less as it is a banking website
• Images are clear and serve their purpose
• Content
• About the various services offered
• No grammatical or spelling errors
• Typography
• Text written is clear and legible
• Font is appropriate for people of all ages

13
Home Page Screenshot

• Navigation Made easy by giving tabs
• Scrolling No Horizontal or Vertical scrolling
  on the homepage
• Color Choice of color is pastel blue, grey and
  white

14
Log In Form

• Layout Deign Remains consistent in between
  pages
• Dialogue Style Form fill-in used to register
  the user

15
Registration Form

• Dialogue Style Menus used to give easy access
  to user
• Dialogue Style Form fill-in used to register
  the user

16
Contact Us Page

• Typography Big font size and black blue font
  color used
• Content To the point precise

17
Loan Application Form 1

• Typography Big font size for ease of use
• Color Black blue font color for good
  readability

18
Loan Application Form 2

• Typography Big font size for ease of use
• Color Black blue font color for good
  readability

19
Loan Application Form 3

• Typography Big font size for ease of use
• Color Black blue font color for good
  readability

20
Search Result

• Navigation Clickable bank name for exact
  location
• Content Can be sorted according to user
  preference

21
FAQs

• Navigation Indexed Questions for easy access
  to answers
• Content To the point precise

22
Site Map

• Navigation Provide access to rest of the site
• Content Structured organized for easy access

23
Comments/issues/Complaints/Assumptions
Tools used planned for use

• Editplus
• IE, Mozilla
• Adobe Dreamweaver
• MySQL Server
• PHP, HTML, Java Script

• Plans
• Developing a fully functional website
• Performing a usability analysis

• Lesson
• Developing a user friendly interface
• Which color to use?
• Which font to use?
• Many more..