View
28
Download
1
Category
Tags:
Preview:
Citation preview
Voka Consultancy Group
U n i v e r s i t y C o l l e g e C o r k
P r o j e c t : I S 6 1 5 3
D a t e : 1 8 / 3 / 1 5
Ismail Hossain-114221879
Brian Murphy-114222980
Brendan McSweeney-114223513
Canice Walsh-114221438
The IT Department at Dragon System Consulting have been tasked with designing and conducting a walk-through of a system prototype to senior management. From this the application architecture of the system will be described.
Client Technology Tracking System
Contents1.0 Introduction.....................................................................................................................................3
2.0 Webpages Analysed.........................................................................................................................4
3.0 Low-Fi Prototype Material...............................................................................................................7
3.1 Prototype Testing........................................................................................................................7
3.2 Metrics.........................................................................................................................................8
4.0 Wireframe Prototype.......................................................................................................................9
4.1 Wireframe Prototype Screens.....................................................................................................9
5.0 Hi-Fi Prototype...............................................................................................................................12
5.1 Justification for Colours used.....................................................................................................12
5.1.1 Justification for choosing Blue............................................................................................12
5.1.2 Justification for choosing Pink.............................................................................................12
5.1.3 Username and Password for Each User..............................................................................13
6.0 Application Architecture................................................................................................................13
6.1 Presentation Layer.................................................................................................................13
6.2 Business Layer.......................................................................................................................13
6.3 Data layer...............................................................................................................................14
6.4 Description and Justification of Technologies Used...................................................................14
6.4.1 Justification of technologies used.......................................................................................16
7.0 Conclusion.....................................................................................................................................16
1.0 IntroductionBased on the analysis of the current system in place at dragon system consulting, it was
suggested that the system was considerably behind competitors in terms of its functionality,
so in order to keep up to date with the dynamic trends in our industry it was agreed that our
current system required significant modification.
In order to assess what changes were needed the research team decided to get user feedback
of the current system to establish what exactly the “as-is” scenario of the current system was.
From there the IT team could get clarification of the changes that needed to be made to create
a satisfactory system for all stakeholders in the “to-be” scenario.
Once the “as-is” scenario was identified, the IT team could begin creating a new system. So
the IT Team recognised that the best first step to take was to analyse similar web pages and
consequently design some low-fi prototypes, including diagrams of the potential new system
as well as a storyboard of how the potential new system would basically work.
When the IT Team were satisfied with the low-fi prototypes, a short video was created
outlining the basic functionality of the potential system. From there the IT team established
what the main tasks/functions of the system would be.
Before a wireframe prototype could be designed the IT Team consulted with the research
team to consider what kind of colour scheme should be used in the system. Once the colour
scheme was justified and once the basics of the system were known the IT Team decided to
take the low-fi prototype one step further by designing a wireframe prototype.
In turn the next logical step after the wireframe prototype was to design the high fi prototype
which essentially is the finished system before publication.
However before publication the IT Team must first of all justify the application architecture
and in turn justify why the IT Team chose certain technologies when developing the system.
2.0 Webpages AnalysedIn order to establish what template the system should follow and what colours should be used
we firstly reviewed similar webpages. The following link
http://www.auctus-software.com/it_consulting.html provides access to similar pages and we
have also included a screenshot.
Figure 1: Auctus
Both the IT Team and Research Team agreed that the navigation bar at the top of figure 1
would be a useful feature for the homepage of Dragon System Consulting, however both the
IT Team and research team believed that the shade of blue used in figure 1 would not be
appropriate for Dragon System Consulting and also it was agreed that there was too much
detail on the homepage. After analysing the webpage illustrated in figure 1, both the IT Team
and research team agreed that the homepage of Dragon System Consulting should be kept
concise.
The following link provides another example of a similar site that was analysed and we have
also included a screenshot. http://uniactiv.com/
Figure 2: UniActiv LLC
From our analysis of figure 2, both the Research Team and IT Team both appreciated the
moving features incorporated. Dragon System Consulting decided to utilise this feature in the
new system as it further enhances the professionalism of the organisation.
The following link http://precisionitconsulting.com/ gives another example of a similar site
that we analysed and we have included a screenshot.
Figure 3 : Precision
Figure 4 : Precision Footer
The screenshots of both figure 3 and figure 4 have come from the same website. Basically
figure 3 was the ideal website to highlight the main colour and layout of the Dragon System
Consulting homepage. Figure 4 is essentially the end of the homepage for figure 3. It was
agreed that Dragon System Consulting should include contact details at the end of the
Homepage.
The following link http://www.antarisconsulting.com/ shows the website Antaris which we
analyzed and also included a screenshot below;
Figure 5 : Antaris
Based on our analysis of the webpage illustrated in figure 5, we found that the search bar at
the top allowed for easy navigation and therefore greater usability. It was agreed that the new
system for Dragon System Consulting should include a search bar so that the user could
easily navigate around the system.
The following link https://www.onforce.com/ gives another good example of a website we
analysed and have also included a screenshot
Figure 6: OnForce
Once again following analysis of the web page illustrated in figure 6 it was decided that it
was best to include a sign up feature for new users at the top of the homepage.
The following link http://www.cit.ie/ gives the last website we analyzed and have also
provided a screenshot below;
Figure 7 : CIT
This page essentially highlights the main colour scheme of the webpage. Following the
analysis of the web page illustrated in figure 7, it was agreed that the pink and blue colour
scheme worked well, so it was decided that Dragon System Consulting should implement this
colour scheme for the system. It was also agreed that the additional functionality of the drop
down menu illustrated in figure 7 would also work well in the Dragon System Consulting
website.
3.0 Low-Fi Prototype MaterialOnce the IT Team analysed other webpages it was agreed that the next logical step should be
to sketch out the proposed system using paper or low fi prototypes. We have enclosed a paper
prototype folder attached to this report, which shows sketches for the proposed site. We
decided to set up a YouTube channel called Voka Consultancy providing videos which
demonstrates a step by step tutorial of using the proposed site. We have provided a table in
the next section with links associated to each paper prototype video.
3.1 Prototype TestingOnce the low-fi prototypes were completed the IT Team recognised the importance of testing
out the low-fi prototypes by illustrating the potential functionality of the system. The IT
Team conducted a number of brief videos illustrating the potential steps that would be taken
when using the system itself. The following table shows how we decided to create a
YouTube channel named Voka Consultancy to walk management through our paper
prototype and outline the functions of the site with the links provided.
Paper Prototypes You Tube Video Links
Manager Paper Prototype https://www.youtube.com/watch?v=LzAIlvdQndk
Client Paper Prototype https://www.youtube.com/watch?v=LmLLMiGRFvU
Receptionist Paper Prototype https://www.youtube.com/watch?v=ZTCEa7x9Pxc
Employee Paper Prototype https://www.youtube.com/watch?v=pyaWjgvq728
Technician Paper Prototype https://www.youtube.com/watch?v=08MvgONj6dg
Sign Up Paper Prototype https://www.youtube.com/watch?v=lJ4cDfZjmgU
About Us Prototype https://www.youtube.com/watch?v=vBhJzztLHiw
Table 1: Paper Prototypes You Tube Video Links
3.2 MetricsThe following metrics table below provides the page name, task or function carried out by
this page and the users that can access each individual page.
Page Name Task/Function AccessIndex Page Can Log in, Sign up, View services,
View about us, user can search for All Users
anything.Service Page Can View what services are provided
by the company such as IT Consulting, IT Services, Cloud Computing and Storage/Security.
All Users
Log in To use the application user must Log in. User can request password if they forget and if they are not members they can sign up.
All Users
Sign Up New Members can sign up to the System.
All Users
Input service request
Users must be logged in to enter service request.
ClientTechnicianReceptionist
Insert work record
Insert Details of Work Completed. Technician
Enter Component information
User can add component information and also edit any changes.
Technician
Check in Inventory
User can check in inventory but cannot change anything.
Receptionist
Insert configuration Information
Changing or entering configuration details.
Technician
Examine unresolved requests and history
User can see all incomplete or unresolved service requests.
ClientTechnicianManagement
Manually Resolve service requests
User can manually mark a service resolved or complete.
Technician
Viewed Installed components
View list of components installed in each client system.
Technician
Input of new equipment
User can enter new equipment or edit Equipment information.
Technician
Enter or edit components type
Creating a new component type or editing an existing component type.
Employee
Enter or edit Equipment type
Creating a new Equipment type or editing an existing equipment type.
Employee
View software Configuration information
View the software configured for each client system.
Technician
Table 2: Metrics
4.0 Wireframe PrototypeOnce the Low-Fi prototypes were completed and the prototypes were tested the IT Team completed wireframe prototypes using Balsamiq software. All of the Balsamiq files can be accessed by using the username and password provided below and we have also included a sample of screenshots.
4.1 Wireframe Prototype ScreensThe following screenshot shows the index page of Dragon System Consulting
Screen Shot 1: Index Page Balsamiq
The following screenshot provides the log in page for Dragon System Consulting;
Screen Shot 2: Login Page Balsamiq
The following link provides a screenshot of IT Consulting page provided through Balsamiq;
Screen Shot 3: IT Consulting
The following screenshot shows the Manager Homepage through Balsamiq;
Screen Shot 4: Manager Home Page
In order to access our Balsamiq prototype we have provided the following log in details which are as follows;
User Name- Voka15
Password-Voka15
5.0 Hi-Fi PrototypeWhen the wireframe prototype was complete, the IT Team decided to design the system itself
using HTML, CSS, JAVA Script, JQuery and Google Chrome.
5.1 Justification for Colours usedThe following screen shot provides an example of colour used for the site
Figure 8: Home Page
Following the analysis of similar webpages both the IT Team and research team came to the
conclusion that the two main colours should primarily be blue and pink as illustrated in
Figure 8.
5.1.1 Justification for choosing BlueBased on similar web pages analysed, blue appeared to be a common colour used. From
consultation with the research team, the IT Team believed that blue was the best colour to
incorporate into the new system as it was felt that blue was both a welcoming colour for the
user but equally gave the system a corporate look.
5.1.2 Justification for choosing PinkPink is also a common colour used in the new system. The navigation bar at the top of the
home page uses pink efficiently. The research team suggested that pink simply works well in
combination with blue as it enhances the corporate look of the system. The IT Team and
research team both agreed that pink and blue worked effectively together thereby giving the
user a unique experience.
5.1.3 Username and Password for Each User To access this application software we have create demo username and password they are below,
User Username Password
Client 100 100Receptionist 200 200Technician 300 300Manager 400 400Employee 500 500
6.0 Application Architecture This section essentially describes the overall layout of Dragon Systems Consulting new
system. The measurement for each section of the webpage will be illustrated via screenshots
in the following section.
6.1 Presentation LayerThe aim for the presentation layer of our site was to improve the user accessibility and use of
the site itself so it is easy to optimise performance, while preventing context switching. This
will therefore reduce compatibility issues, maintenance and deployment cost. With any
project there are downfalls or potential problems such as monolithic pieces of code, hard to
modify due to a lack of documentation and qualified programmers. There is also the chance
of lack of qualified programmers for these systems. This can be seen below with our lay out
and sizes of our site from the viewpoint of the user.
6.2 Business Layer
This layer will allow user to access the database but they don’t have accessibility to change
anything, just like the client can see service request history below. This layer is more than
information delivery; it is a key aspect of the performance of data processing behind the
results being delivered. There are a number of examples to show tis including a program that
implements a withdrawal of stock from a business. This program takes the request, checks
whether there is enough stock in the business, verifies whether stock limits overdrawn,
creates a log entry for the operation, performs the operations against the current stock limit
and gives approval to the employee to issue the stock. It is here that the algorithms are
implemented for the organisations.
6.3 Data layer
This layer will allow us to see the database, and what the business is collecting in relation to
component, system configuration and equipment as well as check inventory, which can be
seen below. The overall systems needs data to work with, data can reside in databases or
other information repositories, this deals with and implements different data sources of
Information Systems. This indicates that it is implemented using a Database Management
System. From our software company example, the RM layer could be the inventory database
of the company. This can also be a gateway to recursively using other systems.
6.4 Description and Justification of Technologies UsedFor accessing this software the recommended browser is google chrome and Firefox. This
software cannot be fully accessed by internet explorer. CSS was used to design the layout of
the pages; JAVA Script formed validation and provided navigation to other pages. HTML
was used to construct applications; JQuery was used for animation while Notepad++ was
used for editing and creating web pages. Balsamiq was used as the tool of choice for the
wireframe prototype. Google Chrome and Firefox were used to test the software.
Layer J2EE Microsoft (.NET)
Presentation Layer HTML, CSS Javascript HTML, CSS JavascriptPresentation Logic Layer JSP/Servlets ASP.netBusiness Layer EntJavaBeans .NET serviced componentsData Access Layer SQL, JDBC SQL ADO.NetData Layer Oracle, MySQL SQL Server
Application for each layer (J2EE vs. Microsoft(.NET)) (Bill Emerson)
Ascertaining which of the two technologies is ‘best-fit’ for Dragon Consulting is difficult, so
much so that it can simply come down to what employees/end-users have the most
experience of using. The following scorecard rates the comparative strengths and weaknesses
of both J2EE and .NET:
Criteria J2EE .NET Comments
Ease Of Use (Development Environment) ** ****
VB.net and C# are easier to use than J2EE
Scalability *** ** Execute Java Code on Mainframe
Single Language Multiple Platforms **** *
Java Can run on many platforms through the JVM
Multiple Languages Single Platform * ****
VB,C#,J# all run in the same run-time environment
Reliability ** **** VB/Com development in 1993
Performance *** *** Equal Performance
Speed of development * *** VB code easier to learn
Reuse **** **Deploy same code on multiple platforms and multiple projects
Open Standards ***** * Java, JVM are open standards
Overall 56% 51%
Scorecard (Microsoft .NET vs J2EE) (Bill Emerson)
The findings above are quite close; J2EE prevailing thanks in part to its ability to run on
many platforms, as well as the fact that its code is reusable on multiple platforms and
multiple projects. Furthermore, J2EE is written in Java, an open platform, in contrast
to .NET, which runs solely on Windows OS 1.
To develop this Dragon System Consulting Application software we have used number of
programming languages which are explained below,
Cascading Style Sheet (CSS) was used to manage the layout and structure of the
pages.
JavaScript was used for form validation and navigation to other pages.
J2EE, PHP and .NET will be used for back end architecture as we do not have
database we did not use them.
Hypertext Markup Language (HTML) was used to build the whole applications
software.
JQuery was used for creating animation to use in banner.
Notepad++ was used for editing and typing code for application design.
Balsamiq was used as the tool of choice for the wireframe prototype.
Google Chrome and Firefox were used to test the application software.
1 This information comes from the class notes
6.4.1 Justification of technologies used After development of application software we have done number of application test to see
how this software is working. To test this software we have used google chrome, Firefox and
Internet Explorer. The test result is below
Google chrome: user can access all the functionalities by using google chrome as
result come from test.
Firefox: user can access all most every functionality by using Firefox chrome as
result come from test.
Internet Explorer: user cannot access all the functionalities by using Internet
explorer as we have done some test.
Platform: this software can be install, setup and run any operating platform
7.0 Conclusion
Based on our comprehensive analysis of various webpages, and following extensive
prototyping, we believe that we have developed an efficient and functional system for Dragon
System Consulting.
The IT Team completed the project through a logical series of steps which was accomplished
on time and on budget with the resources available. Ultimately the Management team at
Dragon System Consulting presented the IT Team with a system problem and essentially
required a satisfactory resolution to the problem.
First of all the IT Team collaborated with the research team to research similar webpages.
Once this step was concluded the IT Team created a Low-Fi Prototype, created a you tube
channel to give the management a step by step guide as to how the use the system. The
wireframe prototype illustrated the outline of the system and the final step was programming
the system to use in the organisation.
Recommended