Download Website Design and Development: A Comprehensive Guide for Retail Technology Companies and more Cheat Sheet Theory of Formal Languages for Automata in PDF only on Docsity!
Higher Nationals – Assignment Front Sheet
Student Name/ID Vo Huynh Dang Khoa Unit Title Unit 10: Website Design & Development Assignment Number Assignment 02^ Assessor Ho Nguyen Phu Bao Submission Date 21-12-2024 (^) Date Received 1st submission
Re-submission Date Date Received 2nd submission Grading grid P5 P6 P7 M4 M5 D2 D Assessor Feedback: *Please note that constructive and useful feedback should allow students to understand: a) Strengths of performance b) Limitations of performance c) Any improvements needed in future assessments Feedback should be against the learning outcomes and assessment criteria to help students understand how these inform the process of judging the overall grade. Feedback should give full guidance to the students on how they have met the learning outcomes and assessment criteria. Grade: Assessor Signature: Date: Resubmission Feedback: *Please note resubmission feedback is focussed only on the resubmitted work Grade: Assessor Signature: Date:
- 03 -BM/ĐT/HDCV/FE 1/
Internal Verifier’s Comments: Signature & Date:
- Please note that grade decisions are provisional. They are only confirmed once internal and external moderation has taken place and grades decisions have been agreed at the assessment.
- 03 -BM/ĐT/HDCV/FE 1/
Want to buy products and add wish list Want to edit product in cart (delete, change quantity)
2. Accessibility standards and guidelines for website
The Web Content Accessibility Guidelines (WCAG) are a set of guidelines for web content that were developed by web developers, authoring tools, and accessibility assessment tools. This implies that technology, tools, and websites are developed and designed with the needs of individuals with disabilities in mind. It allows users to interact with, perceive, comprehend, and navigate the Internet, as well as enabling them to contribute to it. It is also beneficial for individuals who do not have disabilities but have "situational limitations," such as being unable to perceive sound or being exposed to direct sunlight.
2.1 Principles of web design
Figure 2 : Web design Website purpose: The user's requirements must be met by your website. A user will be more inclined to engage with your content if the intention is crystal plain and straightforward on all pages. What is the objective of your website? Are you providing practical information in the form of a "How to guide"? Is it a website that provides amusement, such as sports coverage, or are you selling a product to the user? Although websites may serve a variety of purposes, there are fundamental objectives that are universally applicable. o Defining Your Area of Specialization o Establishing Your Credibility o Generating Prospects o Sales and Customer Service
- 03 -BM/ĐT/HDCV/FE 1/
Simplicity When it comes to the user experience and the efficacy of your website, simplicity is the optimal approach. The following are methods for achieving simplicity through design. Color: It has the capacity to elicit emotional responses and convey messages. The ability to influence the behavior of your customers toward your brand is facilitated by the identification of a color palette that is compatible with your brand. Strive to limit the number of colors to five or fewer. Colors that are complementary are highly effective. Pleasing color schemes enhance consumer engagement and induce a positive emotional response in the user. Typography is a critical component of your website. It serves as the visual representation of the brand's voice and commands attention. The website should employ a maximum of three distinct fonts and ensure that the typefaces are readable. Imagery: Every visual element employed in communication is considered imagery. This encompasses all forms of graphics, video, illustration, and still photography. The company's essence should be captured by all imagery, which should be evocative and embody the brand's demeanor. High-quality images are crucial for creating a professional and credible impression in the minds of visitors, as the majority of the initial information we ingest on websites is visual. Navigation A navigation system is employed on websites to facilitate the interaction between visitors and the content they are seeking. Website navigation is essential for maintaining visitors. Visitors will abandon the website and seek their requirements elsewhere if the navigation is perplexing. It is crucial to maintain a consistent, intuitive, and straightforward navigation system across all pages. F-shaped pattern reading Most internet visitors scan material using the F-pattern. Eye-tracking tests show that individuals view mostly at the top and left of the screen. The F-shaped layout matches Western reading habits (left-to-right and top-to-bottom). A well-designed website will follow readers' natural skimming routine. Content Great content and a well-designed website are essential components of an effective website. Great content can attract and influence visitors by converting them into consumers by employing compelling language.
- 03 -BM/ĐT/HDCV/FE 1/
Develop Fundamental Content: The content of your website is a critical element that sets it apart from others. The prosperity of a website is contingent upon its content. While it is true that many individuals believe that creating a website with a visually appealing design, enhancing the rendering speed, and offering high-quality products is sufficient, these are merely auxiliary factors. Content development is the most critical aspect of a new website; however, the true value of content remains unclear to the majority of individuals. Consequently, the process of creating website content remains a muddled area. Website Promotion: Companies may leverage social media to enhance their brand image and offer their products and services on their websites. After your website is operational, it will be necessary to pursue its development. If you believe that it is simply functioning properly, you are misinformed. It is imperative that you consistently conduct research and enhance your website to ensure that your visitors are both comfortable and contented. Additionally, it is imperative that you provide your clients with items that are exceedingly valuable. These are the attributes that will enhance the allure of your website and assist in the retention of a substantial number of visitors.
3. Use case diagrams
A use case diagram is a method for condensing the specifics of a system and the consumers within it. It is typically represented as a graphic representation of the interactions between various components of a system. Use case diagrams will delineate the events that occur within a system and the sequence in which they occur; however, they do not provide a detailed explanation of how these events are executed. A use case is a methodology employed in system analysis to identify, elucidate, and organize system requirements. In this context, the term "system" denotes an entity that is currently being developed or operated, such as a website that sells and services mail-order products. In UML (Unified Modeling Language), a standardized notation for the modeling of real-world objects and systems, use case diagrams are commonly employed. A use case diagram offers numerous advantages over comparable diagrams, including flowcharts. On my website, the admin has the ability to add, delete, and update tours, and it is also crucial to manage customer information appropriately. The administrator has the authority to remove accounts that have been inactive for an extended period, as well as those belonging to users who breach the terms of service. Customers have the ability to register and log in to the website, allowing them to update their personal information, view details about the items available, and place orders. Additionally, they can remove any tours they wish from their shopping cart.
- 03 -BM/ĐT/HDCV/FE 1/
Figure 3 : Use case diagram
4. Wireframes
Wireframing is a method for designing a website service at the structural level. The layout of content and functionality on a page is frequently determined by the use of a wireframe, which considers user journeys and requirements. The initial step in the development process is the use of wireframes to establish the fundamental structure of a page prior to the addition of visual design and content. Home page
- 03 -BM/ĐT/HDCV/FE 1/
Figure 4 : Home Page (figma) Product page
- 03 -BM/ĐT/HDCV/FE 1/
Figure 5 : Product Page (figma) Login Page
- 03 -BM/ĐT/HDCV/FE 1/
Figure 7 : Register page (figma) Cart Page
- 03 -BM/ĐT/HDCV/FE 1/
Figure 8 : Cart Page (figma)
- 03 -BM/ĐT/HDCV/FE 1/
Section 2: Design document for online shopping
website.
Produce a set of Users’ requirements by using User Story template: As a < type of user >, I want < some goal > so that < some reason > Provide Use case diagrams, wireframes and site map of the web
Section 3: Implementation of website design.
Source code Samples of the Website Screenshots of Final website with explanation Compare the website to the original designs and draw conclusions
Section 4: Test plan and test evaluation.
Produce a test plan (QA) and test cases displaying thorough testing of the design.
- 03 -BM/ĐT/HDCV/FE 1/
