Problem:
Why is the “artistic ideal” an insufficient design philosophy when modern WebApps are built? Is there ever a case in which the artistic ideal is the philosophy to follow?
Answer:
592-19-1P SA Code: 4467
SR Code: 4578
For designing web applications, there are essentially two basic approaches to design. Those are
(i) The artistic ideal of expressing our self.
(ii) The engineering ideal of solving a problem for customer.
The artistic idea was the approach that many developers choose. Design occurred in an ad hoc manner and was usually conducted as HTML was generated. Design evolved out of an artistic vision that itself evolved Web App construction occurred.
The most extreme proponents of agile software development use web applications as poster children for “limited design”. They argue that web Applications immediacy and volatility mitigate against formal design, that design evolves as an application is built (coded), and that relatively little time should be spent on creating a detailed design model. This argument has merit, but only for relatively simple webApplications.when content and function are complex; when the size of the web Application encompasses hundreds of content objects, functions, and analysis classes; when the successes of the web Application will have a direct impact on the success of the business, design cannot and should not be taken lightly.
Problem:
In this chapter we select a broad array of quality attributes for WebApps. Select the three that you believe are most important, and make an argument that explains why each should be emphasized in WebApp design work.
Answer:
4633-13-2P SA: 9420
SR: 6376
The quality of a WebApp is defined in the terms of usability, functionality, reliability, efficiency, and maintainability, security, scalability, and time-to-market.
The three attributes that can be considered important are
1. Security
2. Availability
3. Scalability
Security:
WebApps have become heavily integrated with critical corporate and government databases. E-Commerce applications extract and then store sensitive customer information. Thus, WebApps security is paramount in many situations. Security must be implemented through out the infrastructure that supports a WebApps. So, security is the most important attribute in the WebApps design work.
Availability:
In a technical point of view, availability is the measure of the percentage of time that WebApp is available for use. End – user expects the WebApps to be available 24/ 7/ 365 Even if there exists a best WebApp also, it will not be useful to the users, if it is unavailable. So, availability attribute has an important role in the WebApps design work.
Scalability:
Scalability is also having an equal importance in building WebApps. It is not enough to build a WebApp that is successful. It is equally important to build a WebApp that can accommodate the burden of success and become even more successful. A WebApp that cannot handle significant variation in volume becomes unsuccessful. A WebApp should be able to scale and handle the variation.
Problem:
Add at least five additional questions to the WebApp Design—Quality Checklist presented in Section 17.1.
Answer:
While developing a WebApplication we need to questioning about Design and Quality.
Need to check whether the tasks are executed concurrently or not.
Is threads may create on pre-request basis or not.
Just consider the fine-grained locks to the WebApplication.
We may check the WebApplication may acquire late and release early?
Appropriate synchronization primitive usage is proper or not?
Do you use an appropriate transaction isolation level?
Does this design consider asynchronous execution or not?
Problem:
You are a WebApp designer for FutureLearning Corporation, a distance learning company. You intend to implement an Internet-based “learning engine” that will enable you to deliver course content to a student. The learning engine provides the basic infrastructure for delivering learning content on any subject (content designers will prepare appropriate content). Develop a prototype interface design for the learning engine.
Answer:
4633-13-4P SA: 9420
SR: 6376
Learning engine: An internet based learning engine enables to deliver course content to a student. The learning engine provides the basic infrastructure for delivering learning content on any subject.
Interface design:
Interface design describes the structure and organization of the user interface. It contains the representation of screen layout, definition of the modes of interaction and description of navigation mechanisms
Prototype interface design for learning engine:
User interface design of learning engine consists of following cycle:
After the interface design model is completed then we need to develop the prototype. It is evaluated by the user.
In this, the first step is to analyze the user interface needs of our users. Then interface modeling moves from requirements definition to analysis
Learning engine prototype is designed by some screen sketches
Screen sketches:
While considered the learning engine, the interfaces and functions are
Student services:
Under this some functions are there: They are
• Student centre login
• New Registration
• Pay program fee
• Student Support Services
• Video lectures
Prototype design for learning engine:
Problem:
What is the most aesthetically pleasing website you have ever visited and why?
Answer:
Recreantly, I visited the site www.carwale.com. It is very pleasing web site to me.
Some say hits, some say unique visitors, some say functionality; we say the bottom line is Results. Not just any results.
An attractive web site design may not rank in the search engines. A high traffic website may not convert users. A well ranked web site may not function properly.
This website developed by Ditley Web Design will look professional, will be search engine friendly, and will be designed to lead traffic down the desired path. These are all important aspects to achieve the desired return on investment.
Integration of Internet marketing, web design, and web programming is at the heart of web development. The Internet is no longer a place to post your brochure. It is a place to create brand exposure and do business. It is likely, that more of your clients and potential customers will visit this website than will visit your physical location.
Problem:
Consider the content object Order, generated once a user of SafeHomeAssured.com has completed the selection of all components and is ready to finalize his purchase. Develop a UML description for Order along with all appropriate design representations.
Answer:
592-19-9P SA Code: 4467
SR Code:4578
Content design focuses on two different design issues, each addressed by individuals with different skill sets. Content design develops a design representation for content objects and represents the mechanisms required to instantiate their relationships to one another. This design activity is conducted by web engineers.
Content design is concerned with the representation of information within a specific content object-a design activity that is conducted by copywriters, graphic designers, and others who generate the content to be used within a WebApp.
In the context of Web engineering, a content object is more closely aligned with on data object for Conventional Software. A content object has attributes that include content specific information and implementation specific attributes that are specified as part of design.
Content object order contains that the order number, customer information, bill of materials, shipping information, and billing information.
For each order, The WebApplication will create and display bill of materials and order number.
UML class diagram of for content object order:-
Problem:
What is the difference between content architecture and WebApp architecture?
Answer:
Difference between content architecture and web app architecture:
Content architecture:
The design of the content architecture focuses on the definition of the overall hypermedia structure of the WebApp.
This architecture focuses on the manner in which content objects (or composite objects such as web pages) are structured for presentation and navigation.
The term information architecture is also used to connote structures that lead to better organization labeling navigation and searching of content objects.
Web app architecture:
WebApp architecture describes an infrastructure that enables a web-based system or application to achieve its business objects.
It’s addresses the manner in which the application is structured to manage user interaction, and Handel internal processing tasks, effect navigation, and present content.
Problem:
Reconsidering the FutureLearning “learning engine” described in Problem 17.4, select a content architecture that would be appropriate for the WebApp. Discuss why you made the choice.
Answer:
4633-13-8P SA: 9420
SR: 6376
Content architecture for learning engine:
Content objects are modeled; means that, the information should be formatted through each object to best meet the customer’s needs.
In the learning engine concept customer’s means students.
Architecture:
Content architecture is appropriate for the WebApp because it describes the over all formation of each object’s functionality. And it describes the job of specialists who design the content object by providing the information to be delivered and an indication of the types of generic content. In this content architecture, aesthetic design also is applied to represent the proper look and feel.
In this architecture, the number of content objects incorporated into a single page is a function of users needs.
Problem:
Use UML to develop three or four design representations for content objects that would be encountered while the “learning engine” described in Problem 17.4 is designed.
Answer: Problem:
Do a bit of additional research on the MVC architecture and decide whether it would be an appropriate WebApp architecture for the “learning engine” discussed in Problem 17.4.
Answer:
4633-13-10P SA: 4478
SR: 6376
Yes, the MVC architecture would be an appropriate architecture for the learning engine.
Learning engine: An Internet-based learning enables to deliver course content to a student. The learning engine provides the basic infrastructure for delivering learning content on any subject.
Learning engine is a large interface that involves a huge number of requests, students and information. It needs a database to store and retrieve information and handle requests, and deliver content to students. It needs a page to display and present the issues. As it is a large interface, it needs various components, each handling a different issue. As MVC can handle these issues, it would be an appropriate WebApp architecture for the “learning engine”
MVC stands for model view controller. The MVC pattern contains three major domains – model, view, and controller. Their functions are,
• Model – Model is responsible for actual data processing, like database connection, querying database, implementing business rules etc. It feeds data to the view
• View - The view manages the display of information. It is responsible for look and feel, formatting etc. It accesses enterprise data through the model and specifies how that data should be presented
• Controller - The controller translates interactions with the view into actions to be performed by the model.
So if we consider a learning engine, then the domains of MVC can be used as,
• All the data like queries asked by the user, the content to be delivered, student information etc, are maintained by the model domain.
• The presentation of the information on the Internet will be handled by the view domain, and
• Controller manages access to the model and the view and coordinates the flow of the data between them.
Following is the WebApp architecture for “Learning engine”. It follows the MVC model architecture.
Problem:
What is the difference between navigation syntax and navigation semantics?
Answer:
Difference between navigation syntax and navigation semantic:
In navigation semantic:
• Navigation semantic units (NSU) are defined by a set of pathways that connect navigation nodes.
• Each NSU must allow a user from a defined user category achieve specific requirements defined by a use-case.
• The design being with consideration of user hierarchy and related use cases.
• In this use case, each actor uses the different navigation requirements.
• The structure of NSU is composed of set of navigational sub-structures known as ways of navigating.
Navigation syntax:
The design being with consideration of some possible options. Those are
• Individual navigation link
• Horizontal navigation bar.
• Vertical navigation column.
• Tabs,
• Site maps.
In this, the designer should also establish appropriate navigation conventions and aids.
Problem:
Define two or three NSUs for the SafeHomeAssured.com WebApp. Describe each in some detail.
Answer:
NSUS for safe home assured . com
NSC stands as a series of navigation semantic units.
“A set of information and related navigation structures that collaborate in the fulfillment of a subset of related user requirements”.
For the safe home assured.com website it has consists of different NSUS.
1) Use cases.
2) WON
While considering the use cases in the safe home assured.com,
It will recommended
Safe home assured.com user
Guest
Registered user
Customer service staff
New customer
Existing customer.
(2) WON
A set of navigational sub – structures are called as ways of navigating and WON is modal out of a set of relevant navigational node (NN) these are connected by navigational links.
NSU for safe home assured.com:
Here,
The packages of content objects named as comp description and product components 1.
There two are navigation nodes. And here each arrow represents the navigation links.
Solution: Chapter 17: WEBAPP DESIGN
17.1 Aesthetic design, also called graphic design, describes the “look and feel” of the WebApp and includes color schemes, geometric layout, text size, font and placement, the use of graphics and related aesthetic decisions. A set of graphic design guidelines provide the basis for a design approach. However, usability and not appearance is what bring most users back a web site. The appropriate mix of aesthetics, content, and technology will vary depending upon the nature of the WebApp, and as a consequence the design activities that are emphasized will also vary. Occasionally, a web site may be designed for entertainment only. In this case aesthetic design might be the dominant philosophy to follow.
17.2 The most important of quality attributes for WebApps are usability, functionality, reliability, efficiency, and maintainability. This provides a useful basis for assessing the quality of Web-based systems. These are largely the same quality attributes that are important for every computing application. User will not use application that is hard to use, if an alternative is available. Users are primarily interested in applications that meet their functional expectations. People would prefer to use software that is reliable and efficient. Software engineers can make better use of their work time, if software is easy to maintain.
17.3 Answers will vary. Some additional questions to the WebApp Design—Quality Checklist presented in Section 17.1 would be:
Can the scope and depth of content be easily determined to ensure that it meets the user’s needs?
Can the background and authority of the content’s authors be easily identified?
Is it possible to determine the currency of the content, the last update and what was updated?
Are the content and its location stable (i.e., will it remain at the referenced URL?)?
17.4 Answers will vary
17.5 http://www.graphic-design.com/Web/feature/tips.html) suggests the following Web sites as examples of good graphic design.
http://www.commarts.com/ Communication Arts magazine, a trade periodical for graphic designers. A good source for other well-designed sites.
17.6 Answers will vary
17.7 The architectural designer must identify content architecture and WebApp architecture. Content architecture focuses on the manner in which content objects (or composite objects such as Web pages) are structured for presentation and navigation. WebApp architecture addresses the manner in which the application is structured to manage user interaction, handle internal processing tasks, effect navigation, and present content.
17.8 Answer will vary
17.9 Answers will vary
17.10 Answers may vary, but in general the students argue in favor of using MVC. The Model-View-Controller (MVC) architecture is one of a number of suggested WebApp infrastructure models that decouples the user interface from the WebApp functionality and informational content. The model (sometimes referred to as the “model object”) contains all application specific content and processing logic, including all content objects, access to externaldata/information sources, and all processing functionality that are application specific.
17.11 Navigation design represents the navigational flow between content objects and for all WebApp functions. Navigation semantics are defined by describing a set of navigation semantic units. Each unit is composed of ways of navigations and navigational links and nodes. Navigation syntax depicts the mechanisms used for effecting the navigation described as part of the semantics.
17.12 Answers will vary. To illustrate the development of an NSU, consider the use-case, select SafeHome components,
Use-case: select SafeHome components
The WebApp will recommend product components (e.g., control panels, sensors, cameras) and other features (e.g., PC-based functionality implemented in software) for each room and exterior entrance. If I request alternatives, the WebApp will provide them, if they exist. I will be able to get descriptive and pricing information for each product component. The WebApp will create and display a bill-of-materials as I select various components. I’ll be able to give the bill-of-materials a name and save it for future reference (see use-case: save configuration).
The underlined items in the use-case description represent classes and content objects that will be incorporated into one or more NSUs that will enable a new customer to perform the scenario described in the select SafeHome components use-case.