diff --git a/images/businesscontext.png b/images/businesscontext.png
index 8f8d2e90..87b556c1 100644
Binary files a/images/businesscontext.png and b/images/businesscontext.png differ
diff --git a/images/technicalcontext.png b/images/technicalcontext.png
index 3f5c19b6..1c9fd848 100644
Binary files a/images/technicalcontext.png and b/images/technicalcontext.png differ
diff --git a/index.html b/index.html
index ba9127d7..4d292f64 100644
--- a/index.html
+++ b/index.html
@@ -763,7 +763,7 @@ <h2 id="section-system-scope-and-context">3. System Scope and Context</h2>
 <h3 id="_business_context">3.1. Business Context</h3>
 <div class="imageblock">
 <div class="content">
-<img src="./images/businesscontext.png" alt="businesscontext" width="1053" height="578">
+<img src="./images/businesscontext.png" alt="businesscontext" width="1006" height="578">
 </div>
 </div>
 </div>
@@ -771,7 +771,7 @@ <h3 id="_business_context">3.1. Business Context</h3>
 <h3 id="_technical_context">3.2. Technical Context</h3>
 <div class="imageblock">
 <div class="content">
-<img src="./images/technicalcontext.png" alt="technicalcontext" width="1014" height="578">
+<img src="./images/technicalcontext.png" alt="technicalcontext" width="1028" height="578">
 </div>
 </div>
 <div style="page-break-after: always;"></div>
@@ -1898,12 +1898,60 @@ <h2 id="_change_scenarios">2. Change Scenarios</h2>
 <p>|Term |Definition</p>
 </div>
 <div class="paragraph">
-<p>|&lt;Term-1&gt;
-|&lt;definition-1&gt;</p>
+<p>|Quality Tree
+| Structured representation of quality attributes and their relationships.</p>
 </div>
 <div class="paragraph">
-<p>|&lt;Term-2&gt;
-|&lt;definition-2&gt;</p>
+<p>|Quality Scenarios
+| Specific instances or situations that show the behavior of a system under various quality attributes.</p>
+</div>
+<div class="paragraph">
+<p>|Change Scenarios
+| Scenarios depicting how a system responds or adapts to changes, like fixes or addings.</p>
+</div>
+<div class="paragraph">
+<p>|Usage Scenarios
+| Instances demonstrating how users interact with a system in various contexts.</p>
+</div>
+<div class="paragraph">
+<p>|User Interface
+| The visual and interactive part of a computer program or system through which users interact.</p>
+</div>
+<div class="paragraph">
+<p>|Query
+| Request for information from a database.</p>
+</div>
+<div class="paragraph">
+<p>|Database
+| Organized collection of structured information.</p>
+</div>
+<div class="paragraph">
+<p>|Documentation
+| Written information regarding a system&#8217;s design, functionality, or usage.</p>
+</div>
+<div class="paragraph">
+<p>|NodeJS
+| Runtime environment that allows the execution of JavaScript code outside of a web browser.</p>
+</div>
+<div class="paragraph">
+<p>|ReactJS
+| JavaScript library for building user interfaces, particularly single-page applications.</p>
+</div>
+<div class="paragraph">
+<p>|JavaScript
+| High-level programming language primarily used for creating interactive web pages and applications.</p>
+</div>
+<div class="paragraph">
+<p>|MongoDB
+| Popular NoSQL database program, known for its flexibility and scalability.</p>
+</div>
+<div class="paragraph">
+<p>|CSS
+| Cascading Style Sheets, used for styling and formatting web pages written in HTML.</p>
+</div>
+<div class="paragraph">
+<p>|HTML
+| Hypertext Markup Language, the standard markup language for creating web pages and web applications.</p>
 </div>
 <table class="tableblock frame-all grid-all stretch">
 </table>