Digital Producer Tech/UX Test Assignment Solution Analysis

This document presents a comprehensive solution to a Digital Producer Tech/UX Test assignment. It begins with a detailed website architecture, emphasizing user-friendly navigation and intuitive design. The solution then outlines user stories, illustrating user interactions with the system through diagrams. Technical details are provided, including the use of React JS for interface development, API communication, and database access. Furthermore, the assignment includes work estimates using the Work Breakdown Structure and Function Point Method to ensure accurate timelines and costs. A risk register is also provided, identifying potential project risks and mitigation plans. The assignment covers various website sections, including homepages, course pages, and interactive elements.

Digital Producer Tech/UX Test Assignment
(Note: please deliver the respective solution architecture and the list of questions.)
(NB: I have done the solution architecture below for website elements. This is per the question from
the pdf you attached for me to follow.)
1. Task 1. SOLUTION ARCHITECTURE
a) The Solution Architecture. (Website Architecture)
Website architecture is how the website is organized to help users easily and quickly locate
something they want maybe information and drive conversations to what they want in the
shortest time possible. Website architecture is very important because it strengthens the
user experience. When user experience in a certain website is strong that leads to search
engine rankings, which help in increased visitors and revenue too. The following diagram
shows the proposed web architecture that will be used in order to show the processes and
the logical layout of how the proposed site would look when accomplished. The following
diagram shows our website architecture, how it should look when constructed or designed.
The architecture involves making our users not to think so hard during navigation time for it
will waste their time. A hard website to navigate offers lofty bounce rate and users will hate
that. We have focused on giving very intuitive web experience to our users.
Modelling the architecture is also essential and I have done that. The top layers need to
appear on top as well as the rest need to follow in a consistent manner. This makes it easier
for users to navigate through and find it easy using the website every now and then.
Navigation format is also maintained, the design principles also followed. All the necessary
elements have been used like the sign in part clearly identified to help users get a clear
understanding of how the website flows.
Any attached links should be identified. For instance, our website will have attached videos
links which will allow users to view and watch the videos. This will be made visible by
appropriate communication between the front-end and back-end developers. All pages
should be easily accessed in 3-4 clicks. This means we shouldn’t include too many navigation
over a certain page for users will find it difficult and unpleasing to use our website.

Website Architecture diagram.
(NB: These are questions to be brought with you(the designer) or asked during the meeting. The
attached pdf asked for the questions)
b) Questions to be asked during the meeting.
1. Who are the target audience of our website?
2. Who are our competitors?
3. Are the competitors determined or not?
4. What is the test plan to be used?
5. What type of servers will be used?
6. Is there any goal that is not met?
7. Is the content/information available enough?

(NB: The user stories have been well written, drawn and elaborated as per the question,kindly confirm
from the pdf)
2. Task 2. USER STORIES.
Step 1(Diagram 1) -
- As a user, I can search a number from the system, choose the available numbers from the
favorites or dial their number.The diagram below explains more about the user story. The actor
represents the user or the visitors of the application(Diagram provided in the question paper).
Step 2(Diagram 2) –
-As a user, I can select a number to view, initiate the search process so that he can access the
booking options. The diagram below explains more about the user story. The actor represents
the user or the visitors of the application (Diagram provided in the question paper.

Step 3(Diagram 3) –
-As a user, I can choose the allocated plan so that I can enjoy the benefits offered by that plan as
long as the timeframe given is met. The diagram below explains more about the user story. The
actor represents the user or the visitors of the application (Diagram provided in the question
paper.

3. Task 3. TECHNICAL DETAILS.
(Note: you can make any assumptions for this task. The main goal is to deliver a technical brief,
that leaves the dev team no questions and allows them to start their work.)
(NB: The main goal is to deliver a technical brief)
React JS is a JavaScript based library for developing user interfaces with strong validations and
authentication. It’s mainly used in developing single page or mobile applications and it’s only concerned
on rendering data to the DOM element i.e. document.getElementById (id) in programming. React Js uses
all the JavaScript based principles since it is developed using JavaScript React was created by a software
engineer at Facebook, Jordan Walke, who released it as Fax Js on early stages as a prototype. This was
due to the influence of XHP, which is HTML component for PHP library. Section one should include the
main interface where the user is allowed to enter his or her phone number. Once the phone number has
been submitted, the customized API should enable communication between the backend and the
frontend, i . e the access of the database.
Once the process is initiated the user should be able to see clearly the type of plan one is eligible
of. That is either Basic, Legendary, Exotic among others. Now when one is able to know which plan he
qualifies for, he is able to pick the plan and enjoy the benefits provided by that specific plan. Once, the
chosen plan is activated, then the user should be able to use it as per given requirements and it should
last as stated.
4. Task 4. ESTIMATES.

(NB. (Explain ) please elaborate on the steps you will take to estimate the work and deliver
within the estimate.)
To ensure the work estimates are over 90% accuracy, I’ll go for Work Breakdown Structure Test
Estimation Technique. By this I’ll be able to split the available task into small tasks. Allocate each task to
team members. Estimate the effort required to complete each task. Finally, I’ll validate the estimation.
For the users to be able to choose a number from the system, I’ll analyze the software requirement
specification, investigate the soft requirement specifications, and interview the developer to know more
about the process. After creating the test specification, I will create test cases, design test scenarios and
review and revise test cases.
After that, I’ll execute the test cases by building the test environment, execute the test cases and review
the execution results. Then I create the defect reports. To know the estimates are over 90% accuracy, I’ll
use Function Point Method, where I will do estimates on Size, Duration and Cost. Based on the complex
of design I will give a Weightage of three, which is group Medium. After that I will do duration needed to
finish the task. Total Effort = Total Function Points by Estimate defined per Function Points.
The Total Function Points are the total modules of the task given e.g. part of the site like the one above.
Estimate defined per Function Points is the average effort to complete one function. By doing all this I’ll
finally perform the estimate costs.

5. Task 5: RISK REGISTER
A risk register is a tool used to show potential risks and mitigations plans inclusive of probabilities of the
chances to happen.
(NB: Please create a risk register for the project as per task 2. Highlight all risks, and how you will
mitigate them.)
Risk Id. Risk Description Mitigation Plan
001 If too many users try to access
the service at the same and
send requests to the server, the
initially defined server capacity
maybe inadequate.
Capacity analysis to be done
during design stage, if this
shows a problem design issues
will be revisited.
002 Misunderstanding of the
requirements. The user doesn’t
know what to do with the
system or how to operate the
system.
Ensure before the system is
released, every user has a
complete understanding of how
it operates.
003 Once a user has secured a plan,
he might as well not use the
plan for beneficial purposes.
Make sure a documentation is
given or distributed to all users
to help them know why they
have to choose certain plans
and how to use them.
004 Networks timeout or failure of
power while accessing the
system.
Ensure that the backend is well
developed to know mid-
processed actions and fully
processed actions so that when
a user comes again he will
continue from where he left.