Basic Tutorial of Project Design

Content

1. Project Status
2. About the Project
3. Project Description
4. Chapter 1: Phases of a Project
   • Chapter 1 - Part 1: Basic Phases of a Project
   • Chapter 1 - Part 2: Software Development Life Cycle
   • Chapter 1 - Part 3: Planning
   • Chapter 1 - Part 4: Define Requirements
   • Chapter 1 - Part 5: Design and Prototyping
   • Chapter 1 - Part 6: Software development
   • Chapter 1 - Part 7: Testing
   • Chapter 1 - Part 8: Deployment
   • Chapter 1 - Part 9: Operations and Maintenance
5. Chapter 2: System Overview
   • Chapter 2 - Part 1: Project Scope
   • Chapter 2 - Part 2: Project Detaling
   • Chapter 2 - Part 3: Entities and Entities Attribute
6. Chapter 3: Design UI/UX
   • Chapter 3 - Part 1: Project Wireframe Design
   • Chapter 3 - Part 2: How to Make a Wireframe
7. Chapter 4: Specify Use Cases
   • Chapter 4 - Part 1: Use Cases
8. Chapter 5: Domain Model
   • Chapter 5 - Part 1: What is Domain Model?
   • Chapter 5 - Part 2: Domain Model Abstraction Level
   • Chapter 5 - Part 3: Conceptual Domain Model (Business)
   • Chapter 5 - Part 4: Conceptual Domain Model (System)
   • Chapter 5 - Part 5: Logical Level Domain Model (Relational)
   • Chapter 5 - Part 6: Logical Level Domain Model (Object Oriented)
   • Chapter 5 - Part 7: Physical Level Domain Model (Relational)
   • Chapter 5 - Part 8: Physical Level Domain Model (Object Oriented)
9. Chapter 6: Development
   • Chapter 6 - Part 1: Back end
   • Chapter 6 - Part 2: Web App
   • Chapter 6 - Part 3: Mobile App
10. Usage
11. Contributors
12. Contributing
13. Roadmap
14. To Do
15. Contacts
16. License

Project Status

Project Status: Concluded ✔️

About the Project

This project have a propose to introduce the reader to basic concepts of create a software project.

This tutorial was based in the course from Phd Professor Nelio Alves - UML Design and the Youtube Channel DevSuperior.

Project Description

This project have the object to introduce the reader the basics of "How to start and create a software" in the development world. I think, many of us, have the skills of programm (knowledge in oriented object programm language, relational database, Front-end tools like HTML, CSS and Javascript) but don't have the basics of how to get the ideia that is in the head and pass to a paper.

This tutorial will show a basic way in step-by-step form how to start simple project.

This tutorial will not cover more specific concepts of software development (Scrum, Agile and etc ...), just the basics of "How to create software".

Chapter 1: Phases of a Project

Chapter 1 - Part 1: Basic Phases of a Project

Let's define 5 phases to create a project:

• Describe a system overview (Project Scope and Detaling the Project)
• Design the UI/UX Project
• Specify Use Cases
• Design Conceptual Model
• Development (Develop back end, web app and mobile app)

_{Fig 1 - Basic Phases of a Project}

Chapter 1 - Part 2: Software Development Life Cycle

The phases of a project listed above, is a simple overview of how to create a simple project. In enterprise systems, software applications follow the SDLC, or Software Development Life Cycle. Is a set of steps used to create software applications and this steps divide the development process into tasks that can then be assigned, completed, and measured.

It’s typically divided into six to eight steps: Planning, Requirements, Design, Build, Document, Test, Deploy, Maintain. Some project managers will combine, split, or omit steps, depending on the project’s scope. These are the core components recommended for all software development projects.

SDLC is a way to measure and improve the development process. It allows a fine-grain analysis of each step of the process. This, in turn, helps companies maximize efficiency at each stage. As computing power increases, it places a higher demand on software and developers. Companies must reduce costs, deliver software faster, and meet or exceed their customers’ needs. SDLC helps achieve these goals by identifying inefficiencies and higher costs and fixing them to run smoothly.

_{Fig 2 - The Seven Phases of the SDLC - (Work created by Goran Jevtic)}

The Software Development Life Cycle simply outlines each task required to put together a software application. This helps to reduce waste and increase the efficiency of the development process. Monitoring also ensures the project stays on track, and continues to be a feasible investment for the company.

Many companies will subdivide these steps into smaller units. Planning might be broken into technology research, marketing research, and a cost-benefit analysis. Other steps can merge with each other. The Testing phase can run concurrently with the Development phase, since developers need to fix errors that occur during testing.

Chapter 1 - Part 3: Planning

In the Planning phase, project leaders evaluate the terms of the project. This includes calculating labor and material costs, creating a timetable with target goals, and creating the project’s teams and leadership structure.

Planning can also include feedback from stakeholders. Stakeholders are anyone who stands to benefit from the application. Try to get feedback from potential customers, developers, subject matter experts, and sales reps.

Planning should clearly define the scope and purpose of the application. It plots the course and provisions the team to effectively create the software. It also sets boundaries to help keep the project from expanding or shifting from its original purpose.

Chapter 1 - Part 4: Define Requirements

Defining requirements is considered part of planning to determine what the application is supposed to do and its requirements. For example, a social media application would require the ability to connect with a friend. An inventory program might require a search feature.

Requirements also include defining the resources needed to build the project. For example, a team might develop software to control a custom manufacturing machine. The machine is a requirement in the process.

Chapter 1 - Part 5: Design and Prototyping

The Design phase models the way a software application will work. Some aspects of the design include:

• Architecture – Specifies programming language, industry practices, overall design, and use of any templates or boilerplate

• User Interface – Defines the ways customers interact with the software, and how the software responds to input

• Platforms – Defines the platforms on which the software will run, such as Apple, Android, Windows version, Linux, or even gaming consoles

• Programming – Not just the programming language, but including methods of solving problems and performing tasks in the application

• Communications – Defines the methods that the application can communicate with other assets, such as a central server or other instances of the application

• Security – Defines the measures taken to secure the application, and may include SSL traffic encryption, password protection, and secure storage of user credentials

Prototyping can be a part of the Design phase. A prototype is like one of the early versions of software in the Iterative software development model. It demonstrates a basic idea of how the application looks and works. This “hands-on” design can be shown to stakeholders. Use feedback o improve the application. It’s less expensive to change the Prototype phase than to rewrite code to make a change in the Development phase.

Chapter 1 - Part 6: Software Development

This is the actual writing of the program. A small project might be written by a single developer, while a large project might be broken up and worked by several teams. Use an Access Control or Source Code Management application in this phase. These systems help developers track changes to the code. They also help ensure compatibility between different team projects and to make sure target goals are being met.

The coding process includes many other tasks. Many developers need to brush up on skills or work as a team. Finding and fixing errors and glitches is critical. Tasks often hold up the development process, such as waiting for test results or compiling code so an application can run. SDLC can anticipate these delays so that developers can be tasked with other duties.

Software developers appreciate instructions and explanations. Documentation can be a formal process, including wiring a user guide for the application. It can also be informal, like comments in the source code that explain why a developer used a certain procedure. Even companies that strive to create software that’s easy and intuitive benefit from the documentation.

Documentation can be a quick guided tour of the application’s basic features that display on the first launch. It can be video tutorials for complex tasks. Written documentation like user guides, troubleshooting guides, and FAQ’s help users solve problems or technical questions.

Chapter 1 - Part 7: Testing

It’s critical to test an application before making it available to users. Much of the testing can be automated, like security testing. Other testing can only be done in a specific environment – consider creating a simulated production environment for complex deployments. Testing should ensure that each function works correctly. Different parts of the application should also be tested to work seamlessly together—performance test, to reduce any hangs or lags in processing. The testing phase helps reduce the number of bugs and glitches that users encounter. This leads to a higher user satisfaction and a better usage rate.

Chapter 1 - Part 8: Deployment

In the deployment phase, the application is made available to users. Many companies prefer to automate the deployment phase. This can be as simple as a payment portal and download link on the company website. It could also be downloading an application on a smartphone.

Deployment can also be complex. Upgrading a company-wide database to a newly-developed application is one example. Because there are several other systems used by the database, integrating the upgrade can take more time and effort.

Chapter 1 - Part 9: Operations and Maintenance

At this point, the development cycle is almost finished. The application is done and being used in the field. The Operation and Maintenance phase is still important, though. In this phase, users discover bugs that weren’t found during testing. These errors need to be resolved, which can spawn new development cycles.

In addition to bug fixes, models like Iterative development plan additional features in future releases. For each new release, a new Development Cycle can be launched.

Chapter 2: System Overview

Chapter 2 - Part 1: Project Scope

The Project Scope is the first part of how to elaborate a project.

In the project scope, we will elaborate the delimitations of the project, what is part of the project and what is not and another aspects like goals, deliveries, tasks, responsabilities, deadlines and costs.

In the example below, we will make a scope of a simple project.

Project Scope Statement
Project Name	Order registration and delivery system for a pizzeria
Project Sponsor	John Ries, CEO
Project Manager	Vitor Garcia
Date of Approval	06/30/2019
Last Updated	06/15/2019

1. Scope Description

   Purpose of the project is to optimize the delivery and order register client in GoodPi Pizzeria located in São Paulo, Brazil.

2. Project Deliverables

   major project activities:

   • project planning.
   • requirement specification.
   • software installation.
   • adjust software to client’s needs.
   • training of pizzeria employers and couriers staff.

   deliverables:

   • project schedule.
   • requirement specification document.
   • ready-to-use system.
   • training plan.
   • training manual.

3. Acceptance Criteria

   Successful move to new system solution over the weekend (10/27/19 – 10/28/19).

4. Constraints

   Due to delivery commitments to customers the system transition must be performed during the weekend.

5. Assumptions

   InventoryMaster consultants take over installation and configuration of software.

Chapter 2 - Part 2: Project Detaling

In the example below, we will make a basic description of the project we are using like example.

The pizzeria GoodPi, want to implement a order and delivery system. The client enter in the website of the GoodPi and select the product that he want. This product have a id, name, price, description and image. After the client register the order, this order will generate a localization (latitude and longitude) of the client and a moment that will be send to the courier to the delivery and will be generated to the courier a map with the delivery address of the client. The order have a status and a total of the order. Each order have a localization and a order can have multiple products.

Chapter 2 - Part 3: Entities and Entities Attribute

After the description, check what is will be your entities and entities attributes in the description and highlight the text:

_{Fig 3 - Entities of the Project}

Chapter 3: Design UI/UX

Chapter 3 - Part 1: Project Wireframe Design

A wireframe is a two-dimensional skeletal outline of a webpage or app. Wireframes provide a clear overview of the page structure, layout, information architecture, user flow, functionality, and intended behaviors. As a wireframe usually represents the initial product concept, styling, color, and graphics are kept to a minimum. Wireframes can be drawn by hand or created digitally, depending on how much detail is required.

_{Fig 4 - Web App Wireframe Example (https://www.visual-paradigm.com/features/ux-design-and-wireframe-tools/)}

_{Fig 5 - Mobile App Wireframe Example (https://www.visual-paradigm.com/features/ux-design-and-wireframe-tools/)}

Chapter 3 - Part 2: How to Make a Wireframe

We can make a simple wireframe, using Figma or Adobe XD to make a simple wireframe. You will make a draft of the user interfaces and the UI/UX designer will develop the user interface propertily.

Below, is a wireframe design and the final web app develop.

_{Fig 6 - Wireframe Vs Final (https://www.wirify.com/)}

_{Fig 7 - The Final UI/UX Design}

_{Fig 8 - The Final UI/UX Design}

Chapter 4: Use Cases

Chapter 4 - Part 1: Use Cases

The Use Case is a useful tool to specify what will be the input from the user and what will the the output from the system.

In the example below, we will make a use case of the project we are using like example.

Register Order

1. [OUT] The system show a list with name, price, description and images of all products, ordered by name.
2. [IN] The client select the desire products and inform the delivery location of the order.
3. [OUT] The system inform the order id.

Deliver Order

1. [OUT] The system show a list with id, total value, instant and items of the pending orders, ordered by oldest to youngest.
2. [IN] The courier select the order.
3. [OUT] The system inform a map with the route till the delivery location.
4. [IN] The courier inform that the order was delivered.

Chapter 5: Domain Model

Chapter 5 - Part 1: What is Domain Model?

A domain model is a visual representation of real situation objects in a domain. A domain is an area of concern. Its used to refer to the area you are dealing with. The model is a diagram, for domain models the class diagram UML is mostly used.

Chapter 5 - Part 2: Domain Model Abstraction Level

Level	Responsible	Objective	Tools
Conceptual Domain Model (Business)	Business Analyst	Describe the domain (business) entities and their interrelationships: Regardless of the System	Entity–relationship model (or ER mode)
Conceptual Domain Model (System)	Systems Analyst	Describe the domain (system) entities and their interrelationships: Regardless of paradigm and technology	Class Diagram (Without OO Elements)
Logical Level Domain Model (Relational)	Designer	Describe the domain (system) entities and their interrelationships: - Stuck in a paradigm (Ex: Relational) - Technology independent	Relational Model (Or RM)
Logical Level Domain Model (Object Oriented)	Designer	Describe the domain (system) entities and their interrelationships: - Stuck in a paradigm (Ex: Object Oriented) - Technology independent	Class Diagram
Physical Level Domain Model (Relational)	Implementer	Describe the domain (system) entities and their interrelationships: - Stuck in a paradigm (Ex: Relational) - Technology Dependent (Ex: MySQL)	SQL
Physical Level Domain Model (Object Oriented)	Implementer	Describe the domain (system) entities and their interrelationships: - Stuck in a paradigm (Ex: Object Oriented) - Technology Dependent (Ex: Java)	Java, C#

Chapter 5 - Part 3: Conceptual Domain Model (Business)

_{Fig 9 - Conceptual Domain Model (Business)}

Chapter 5 - Part 4: Conceptual Domain Model (System)

_{Fig 10 - Conceptual Domain Model (System)}

Chapter 5 - Part 5: Logical Level Domain Model (Relational)

_{Fig 11 - Logical Level Domain Model (Relational)}

Chapter 5 - Part 6: Logical Level Domain Model (Object Oriented)

_{Fig 12 - Logical Level Domain Model (Object Oriented)}

Chapter 5 - Part 7: Physical Level Domain Model (Relational)

INSERT INTO tb_order (latitude, longitude, moment) VALUES (-23.561680, -46.656139, TIMESTAMP WITH TIME ZONE '2021-01-01T09:00:00Z');
INSERT INTO tb_order (latitude, longitude, moment) VALUES (-23.561680, -46.656139, TIMESTAMP WITH TIME ZONE '2021-01-01T09:00:00Z');
INSERT INTO tb_order (latitude, longitude, moment) VALUES (-23.561680, -46.656139, TIMESTAMP WITH TIME ZONE '2021-01-01T09:00:00Z');
INSERT INTO tb_order (latitude, longitude, moment) VALUES (-23.561680, -46.656139, TIMESTAMP WITH TIME ZONE '2021-01-01T09:00:00Z');
INSERT INTO tb_order (latitude, longitude, moment) VALUES (-23.561680, -46.656139, TIMESTAMP WITH TIME ZONE '2021-01-01T09:00:00Z');
INSERT INTO tb_order (latitude, longitude, moment) VALUES (-23.561680, -46.656139, TIMESTAMP WITH TIME ZONE '2021-01-01T09:00:00Z');

Chapter 5 - Part 8: Physical Level Domain Model (Object Oriented)

@Entity
@Table(name = "tb_order")
public class Order implements Serializable {
	private static final long serialVersionUID = 1L;
	
	@Id
	@GeneratedValue(strategy = GenerationType.IDENTITY)
	private Long id;
	private Double latitude;
	private Double longitude;
	private Instant moment;

Chapter 6: Development

Chapter 6 - Part 1: Back end

The source code back end

_{Fig 13 - Back End Tools}

Chapter 6 - Part 2: Web App

The Web App Deploy

_{Fig 14 - Web App Tools}

_{Fig 15 - Web App Deploy}

Chapter 6 - Part 3: Mobile App

_{Fig 16 - Mobile App Tools}

_{Fig 17 - Web App Deploy}

Usage

Using this like a bibliography if you want to remember project design concepts.

Contributors

Vitor Garcia

Contributing

Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

Roadmap

See the for a list of proposed features (and known issues).

To Do

Project Completed

Contacts

Vitor Garcia

License

• 

• Distributed under the MIT License. See LICENSE for more information.