Web User Interface Design Principals - Term Paper Example

? Web User Interface Design Principals al Affiliation) In this paper we are going to tackle web designing with the topic under focus being web user interface design principals but under the perspective of systems design engineering. The back bone of this paper is the web which is simply defined by the Merriam Webster dictionary, as part of the internet where information is accessed through a graphical user interface via hyperlinks connection (Lynch & Horton, 1999). Web user interface designing is therefore the process of creating or improving the visual and utility of a website by making it user friendly. This is achieved by making the website contain the following principals: user friendly, this is when the user enjoys using the interface due to ease in utility; simple memorization, the user is able to remember how to use the structure of the site ease after a period of time without using the interface; reliable, the interface can easily meet users' needs with minimal effort and resources; efficient, the user goals are meet within the shortest time possible through easy understandable instructions; useful, the can achieve his needs in a comprehensive and systematic way; learning ability, this principle basically answers the question how easy is it for the user to understand the basics (Miller, 2011). These principles are achieved through a well set up engineering design systems. This therefore brings us to the subject of discussion in this paper and that is system design engineering. System design engineering involves design, construction and maintenance of large software systems. The first stage involves project management methodology. It is this methodology that is used to create web interface programs/ websites (Duyne, 2003). The main aim of coming up with a methodology is to concentrate on the design phases and analysis and this trickles down to reduced development and production cost. Web design methodologies are categorized into five and these are: Waterfall, Structure System Analysis and Design Method (SSADM), Prototyping, Rapid Application Development (RAD), Incremental Prototyping. According to Bean (2009), the water fall method contains a series of connected stages that cover the development process with the smallest level of redundant instruction between each stage. The disadvantage of this method is that its structures are rigid and lack iteration between any stages that are not adjacent. The web is rapidly growing structure therefore any method used in web site development must be highly versatile. The Structure Systems Analysis and Design Method (SSADM), is method designed to develop fairly large websites. This method concentrates on the design and analysis stages with the aim of reducing errors that might arise later. Prototyping is used in the development of interactive applications whereby the visual layout is important than the utility process of the system. The major problem of this method is that the user adds components on the prototype that are not part of the original system requirement thus the project is in constant state of prototype. Secondly it involves a large coverage of users; this raises the concern in defining a set of users to analyze the prototype (Garrett, 2011). The Rapid Application Development (RAD) method is a form of prototyping that contains numerous minute prototypes that make a large system and are deleted once they have been analyzed. Finally there is the Incremental Prototyping, which allows development of large systems in stages. The systems are developed to completion first and then other minor entities are added to the system later. This method is mostly used by web designers because it is highly dynamic and it supports website growth in terms of functionality and size. The incremental method therefore helps manage website sprawl.” These are considered to be the traditional methods of web designing (Powell, 2000). It is now the designers mandate to choose which web system methodology that suits the needs of the project he is dealing with. In order to come up with the best methodology a web designer needs literature obtained from research or records of the daily running of the organization and experiences of important individuals in the organization. The following are methodologies which have been researched upon: according to P. J Lynch Style Guide, the most important process in website development is developing the structure of the website in order to attract audience to the site (Vest & Crowson, 2005). This method is considered to be of the stone age era in terms of web designing. The methodology has been overtaken by time since the present technology is far advanced. According to Stone (2005), there are seven stages which include: information architecture, User interface and navigation design, Content creation and authoring, Workflow and document management, Publishing, Document review and link management and Search and retrieval. This is a relatively new process but its weakness is that it is too specific since it tends to focus document in the World Wide Web. This therefore limits its rate of growth and as we know the internet is a dynamic developing structure. Beaird (2007) points out the Ikonic’s Five Box development process which contains a five stage development method which is client oriented in each of the five stages. This methodology contains a documentation which provides the client with technical information to run, expand and recreate the site. These documentations also helps create a good relationship between the developer and the client. This methodology is highly creative but its creativity is limited up to a given stage. In this case creativity is evident on the graphical design only but not from the goals to the implementation stage as it ought to be. Siegel further comes up with another methodology that structures web designing into four distinct stages which include: strategy, design, production and delivery. Each stage is completed by a number of tasks that have been set. This model is the most comprehensive during research. The use of four logical stages which are further broken down into tasks makes the methodology have a simple and easy to understand structure therefore this method is fairly attractive. The method is structured to support large teams of web developers, each with their own role in the development process. From the article Communication of the ACM, Isakowitz et al comes up with the Relationship Management Methodology (RMM) which is a method for developing hypermedia systems. New technological systems have been developed after the hypermedia systems and some say it is outdated but it still one of the major systems of website design. The method involves creating relationships between entities using a relationship structured diagram. This method highly depends on the IS terminologies and practices which are to complex therefore this method is difficult to be put into action. This is because many developers lack proper IS knowledge (Cato, 2001). Cranford –Teague did a comprehensive research about the website accompanied by a series of tests and came up with a site definition document. This document points out the goals, target audience and navigation of the website. The website in this model is developed through five liner stages. The each and every stage has an effect on the preceding stage, so the developer needs to reiterate a number of times the intended idea is obtained. The major advantage of this method is that testing is done at an early stage and that is before the coding process (Willard, 2011). The testing involves the conceptual model against parts of the definition document where necessary changes are made depending on the test results. This process is cheap because changes are made at the early stages of the website development. Russo and Graham invented a design methodology which contained nine iterative steps with interconnected feedbacks. The steps include: Identification of the problem, analysis, Design of the application, resource gathering, coding, testing, implementation and Post – Implementation Review and Maintenance. This methodology analyses the whole development process from the formulation of the web strategy to the problems that come up after implementation. It therefore contains benefits like those that come with the SSADM systems (Stone, 2005). This is therefore the best and most applied methodology of the stated methods. Therefore it is through website research literature and the experience of the researcher that a methodology is selected to develop a website. The second stage of web system engineering is the Unified Modeling Language (UML). Unified modeling language is an object oriented programming language that is used in setting up software structure. This language enables programmers to create objects that represent a set of systematic structured data within a program. Unified Modeling language is considered the standard language for software development because it’s accepted and approved by the Object Management Group (Hoekman, 2008). UML contains different types of diagrams which represent different set of instructions within a program. The different types of diagrams are represented below: The functional /case diagrams show operations carried out by the system based on specified requirements .This diagram best depicts a business process of an automated system and the way they function. Deployment diagram analyses the hardware used in the structural program implementation and tends to establish a connection between the processor and other components. These diagrams are used to design the hardware layout of the system. State chart diagrams display the flow data or information or commands from one point to another. Activity diagram shows the fine details of transitions from one point to the next point. Flow charts can be designed from this system. Sequence diagram portrays the order of communication between entities. Collaboration diagram represents interaction of all type no matter the sequence. Class diagrams represent a graphical logical model system and provide a source code for the classes on the diagram thus establishing a link between classes and interfaces Component diagram also referred to as module diagram. In this case, objects and classes are distributed by modules. This design is counting large number of modules. Unified Modeling Language has numerous characteristics which are viewed as being advantageous in designing (Miller, 2011). These include: it is used to model large complex software systems since it supports middleware systems; its contains Microsoft Operating Framework (MOF) which is key component of object oriented modeling; The Unified Modeling Language profiles play a major role in designing Fault Tolerant, Real Time and Transactional systems in a realistic way; it can design any type of application no matter the operating system hardware, programming language. it generates a double code of stub code and test script when connected to integrated development network. It supports changes in the class diagram design since it contains a reverse engineering support system. Unified Modeling Language is large and complex this makes it hard to put the models and code in a systematic format (Vest & Crowson, 2005). On the basis of this analysis Unified Modeling Language is considered the best programming language for designing website application and command softwares. The third stage is requirement analysis process. The main aim of this stage is to develop a strategy of creating the website and ways in which these strategies can be turned to reality which is a functioning website system (Galitz, 2002). This is achieved through sequential steps with Step one being the development of a web strategy. This involves coming up a list reasons explaining the aim of the site. The document should state the vision, mission and the present status of the organization and its future projections. This stage is marked by a well defined strategic planning document. Step two is the definition of website objectives, this involves coming up well structured document containing the outlined objectives which have been identified by the organization and the website designer. Step three is analyzing the website objectives. This involves coming up with a budget of the construction and maintenance of the website; identifying the risk involved in the pre and post construction of the website; evaluating the communication and technology equipments needed to design, construct and maintain a website; analyzing the user base of the site (Beaird, 2007). All these processes comprise the requirement analysis. This leads us to the next stage. Software design methodologies, these are a set instructions used in the management of the software development (. There are a number of methods used in software designing, these include: STRADIS (Structured Analysis, Design and Implementation of Information Systems) highly depends on data flow diagrams and is structured using the Top –Down approach; YSM (Yourdon System Method). Also uses the Top – Down approach but it lays emphasis on the data structure due to the Middle – Out approach it has adapted; MERISE ( Mehtode d’Etude et de Realisation Informatique pour les Systemes d'Enteprise) structured into three cycles and these are decision cycle, life cycle and abstraction cycle and here data is perceived as being conceptual, logical and operational; SSADM ( Structured Systems Analysis and Design Methodology) is a data flow oriented system which adopts the waterfall model which makes it perspective oriented. These are considered to be the best software design methodologies due to their vast preference by system designers (Gao, 2005). Database design: A data base is a structural system used to store data and information. Before designing a database, the system designer should have background information of the organization he is designing the database for. The information involves data and entities within the organization which will help the designer come up a database model which will reflect the characteristics of the organization (Stone, 2005). Therefore a database design is the converting an actual model to a digital database model and this involves representing actual entities in form of tables and columns. The diagram below displays how and actual model is converted into a database model. This is the followed up by coming up with an application design, which will transforms the set up database model into a user application. This application is where the user keys in new data and access information within the database (Garrett, 2011). Application designing tools like Visual basic, C++, Oracle Developer, Power Builder and Oracle Designer are used for this purpose. The transformation from database model to an application is displayed below. These two processes give rise to different database design models. These types of databases include, Flat-file database model, Hierarchical database model, Network database model, Relational database model, Object-oriented (OO) database model, Object-relational (OR) database model. The Flat-file database model contains readable files stored in text format known as fields. Below is an example of a flat file database design. 5674 John Bean London 2541 George Ray Seoul 9278 Jared Morgan Chicago In the above design there is a field for the variables of identification number, name and city. Despite the fact that flat file is simple and easy to understand it suffers from a number of setbacks which include: it has low accuracy levels which arises from the difficulty of managing data, it is redundant in nature, the location of the data must be known in order to access data, there is no structure that adequately links related data (Bean, 2009). The Hierarchical Database Model shows the relationship between groups of data. This contains the root group of data which is then connected to the child group table. This is designed on the basis of parent and child relationship. This is represented diagrammatically like shown below In this model data is easily managed and therefore data integrity is maintained. There is fast retrieval of data due the existent relationship between structures. The disadvantage of this model is that, one must be familiar with the structure of the database (Galitz, 2002). Network Database Model contains tables related to one another with the parent table sharing a link with the child table. In this model the child table can have numerous parent tables as portrayed by the diagram. In this model, the user can quickly access since data in accessed on a random way. This means that data from any table can be accessed. The network model can be used to design large and complex databases. The problem with this model is that the structure of the database is not easily changed and when it is changed it affects the whole database. Relational database model has been designed in a way which it can support one – one, one – many and many – many table relationship. In this model a root table can have multiple child tables and vise versa (Erl, 2008). The model allows the user to ask for a specific data without comprehensive knowledge of information in the database. This makes the data access process quick. The negative side of this model is that, the user must know the relationship between the tables. A sample of this design is displayed below Object oriented (OO) database is a model that uses an OO language to determine the structure of the database and an application program and how they interact with each other. The structure is represented as This model has an object structure where objects are linked with each other and a literal structure whereby values are associated with objects. An example of an integration of these two structures is shown below. The benefit of this model is that only the understanding of the OO concepts is needed. Most of the application program is automated. On the opposing end of the model the user needs to understand the OO concepts. Object – Relational (OR) Database Model was designed the idea of integrating the object oriented programming style with the relational database model (Gao, 2005). This model is still in its infant stage and therefore it has not yet been fully adapted. An illustrated diagram of the model is displayed below With this models available database designing is made easier since the designer can choose from any of these models depending on the database he wants to create. A database design of good quality is made with the sole purpose of promoting the organization. At this stage the designer has full control of the development, implementation and management of the project. The database design thus comes up with a product which is accurate and easy to use and performs to the expectations of the user (Willard, 2011). This makes the database user friendly. If the database design in comprehensively planned this gives birth to a database where data is easily accessed and changed according to the users’ desire. This makes the user have a transparent view the database as he works with the database application. Database design furthermore simplifies the maintenance process and makes it easy to execute. This in the long run reflects on the integrity of the data within the database system. All this is done with the organization or business rules and processes in mind. The database design should be based on a well structured design plan whereby the audience which is the end users is interviewed thoroughly. After the interview the feedback user should be thoroughly analyzed to make sure the organization or business elements are captured. This will prove effective because it helps get rid of problems that may frustrate the user and the technical team. This process ensures that the database is fully functional. This portrays how the database design is a crucial process in the systems engineering process (Cato, 2001). Enterprise Data Warehouse is a consolidated database that contains all the information and structural data of an organization which is made available to all authorized users within the organization. Enterprise data warehouse is designed to develop a distinct structure which manages all the data of an organization (U.S. Dept. of Health and Human Services, 2006). The structure of the enterprise warehouse is sub - divided into minor sections which represent different departments of an organization. It is be highly flexible and this calls for the use of a normalized database system so as to withstand complexities which come with growth. It handles unforeseen conditions since it is developed with disaster recovery features and security features. Software testing is the process of evaluating the ability of developed program to meet the needs of the specified user. Testing of website system software is no walk in the park. This process is usually very complex based on the fact that the website has a number of unlimited users who access it. The web - site must be evaluated using numerous technological techniques so as to determine its ability to satisfy the users' needs. Testing can be done in two stages with the first stage being the design testing. Design testing is done during the development of the software with the sole purpose of identifying faults. This process is cost effective since the inconsistencies are identified at early stage (Gao, 2005). Design testing makes sure the system can produce the information needed by the audience. The second testing is done after the software has been coded through a process known as debugging. This stage is known software testing stage. There are two methods used to test software and these are: the black box testing approach where data is obtained from the functional requirements of the program. The white box or glass box approach evaluates the program structure which includes the logistics, style and the programming language used. For effective testing both the black box and white box approach should be adopted. These two approaches are used to test the correctness, performance, reliability and security of the software. Testing cannot be done without tools and techniques (U.S. Dept. of Health and Human Services, 2006). There are numerous software testing tools which are designed for a specific purpose. Some of the testing tools include: mothora which execute and measures test cases, removes bugs, measure input and output correctness and finally documents the test; NuMega’s Boundschecker and Rational’s Purify , check and protect against pointer problems and memory leaks. Testing is a complex art which involves a number of tools, techniques and is done throughout the programming cycle. Software implementation, once the website has been designed and constructed and tested it posted in the World Wide Web. This is the most important stage since it ensures the presence of the website is felt by user and other audience. The main goal of software implementation is advertising the website. Therefore it’s important for the designer to identify the most effective advertisement medium so as to reach the targeted audience within the shortest time possible and in the most enticing way (Sklar, 2006). There are various modes of advertisements from which the designer may choose from and these include: Search engines, the designer should identify the most common search engines such as Google or Yahoo and register the site with them; new groups as provide a basis of advertisement through news papers, magazines and journals. This is done by printing the website domains on these stationeries. The implementation process does not stop at that point; it involves monitoring and evaluation of the site. This is because the site is highly volatile with new data being feed in the site frequently. This ensures that the information within the site is up to date. The internet is highly volatile and new technologies are developed frequently. The implementation stage makes sure the new technologies are integrated within the system and are in synch with objectives of the website. It is also at this stage that the objectives that were dropped in the wish list are reviewed and integrated into the system depending on the needs that arise (Earl, 2008). Software maintenance, According to Cato (2001), software maintenance is the process of modifying software after it has been delivered to correct errors, improve performance and enhance the programs adapting capacities to the changing environments. According to Lientz and Swanson there are four major categories of maintenance and these include: corrective maintenance handle the repair of defects (coding errors, logic errors, design errors) detected; adaptive maintenance contains an adaptive software which changes depending on the external influences such as software and hardware systems; perfective maintenance involves improving the systems activity to meet the changing needs of the user; preventive maintenance involves improving the coding structure of a program so as to improve its maintenance structure. The web designer should come up with an adequate maintenance design structure which can maintain the complexity of the system and keep it up to date (U.S. Dept. of Health and Human Services, 2006). All these processes_ design methodologies, database design, enterprise warehousing, software implementation, project management methodology, UML (Unified Modeling Language), requirements analysis, software testing, and maintenance are the back bone of the software system (Willard, 2011). Therefore creativity in the designing of each and every stage should be maintained in order to come up with a website software system that is user friendly, easy to maintain and is highly volatile so as to adapt to the changing external conditions of the world wide web. References Beaird, J. (2007). The principles of beautiful web design. Collingwood, Australia: SitePoint Pty. Ltd. Bean, J. (2009). SOA and Web services interface design principles, techniques, and standards. San Francisco, Calif.: Morgan Kaufmann. Cato, J. (2001). User-centered web design. Harlow, England: Addison-Wesley. Duyne, D. (2003). The design of sites: patterns, principles, and processes for crafting a customer-centered Web experience. Boston: Addison-Wesley. Erl, T. (2008). SOA: principles of service design. Upper Saddle River, NJ: Prentice Hall. Galitz, W. O. (2002). The essential guide to user interface design: an introduction to GUI design principles and techniques (2nd Ed.). New York: Wiley Computer Pub. Gao, Y. (2005). Web systems design and online consumer behavior. Hershey PA: Idea Group Pub. Garrett, J. J. (2011). The elements of user experience: user-centered design for the Web and beyond (2nd ed.). Berkeley, CA: New Riders. Hoekman, R. (2008). Designing the moment: web interface design concepts in action. Berkeley, CA: New Riders. Lynch, P. J., & Horton, S. (1999). Web style guide: basic design principles for creating web sites. New Haven [Conn.: Yale University Press. Miller, B. G. (2011). Above the fold: understanding the principles of successful web site design. Cincinnati, Ohio: How Books. Powell, T. A. (2000). Web design the complete reference. Berkeley, Calif.: Osborne/McGraw- Hill. Research-based web design & usability guidelines (Version 2. ed.). (2006). Washington, D.C.: U.S. Dept. of Health and Human Services. Sklar, J. (2006). Principles of web design (3rd ed.). Boston, Mass.: Thomson, Course Technology. Stone, D. L. (2005). User interface design and evaluation. Amsterdam: Elsevier :. Vest, J. & Crowson, W. (2005). Exploring Web design. Australia: Thomson/Delmar Learning. Willard, W. (2011). Web design demystified. New York: McGraw-Hill. Read More