Questions

Questions based on each section of the Lesson

Write about how you plan to use what you learned in this lesson to improve your CPT project.


Customization 1

1. What are some of the best practices for creating effective wire-frames in computer science? How do wire-frames help with the design process?

Effective wireframes are user-focused and concise. They provide clear indication of intended interactivity and are feasible to implement in code. When creating a wire-frame, one must keep in mind that not only must the user interface be eye-catching, but the user experience must also flow in a logical manner so as not to distract the user from the content.

2. How does user testing play a role in the design of user interfaces and wire-frames in computer science? Can you provide an example of a project where user testing significantly impacted the final product design?

User testing plays a large role in user interface design because, after all, the interface is designed specifically for the user. One method that websites often use to test interface design is A/B testing. Companies will selectively enable or disable certain UI features/updates for a group of users and collect statistics on whether their product is more successful (gets more clicks, etc.). Once a feature is confirmed to show significant statistical evidence of being more effective than the current design, it gets implemented for all users.

Customization 2

1. What is Bootstrap and how is it useful for developing websites?

Bootstrap is a CSS library that provides modular styling classes for developers to use instead of creating their own from scratch.

2. What are the benefits of using Bootstrap in web development compared to css?

Bootstrap is CSS. I'm assuming you're referring to the practice of rolling your own CSS. By leveraging Bootstrap classes, the developer can save valuable time and instead use it for actual content development.

3. How can you include Bootstrap in YOUR website development?

You can the resource to your HTML `<head>` tag and simply mark HTML elements with whatever classes you would like.

4. What do selectors do? Explain one selector in your own words.

Selectors allow you to refer to a singular element or a collection of HTML elements by an identifying attribute. Often, selectors select on the basis of the `class` attribute. The `.test` selector, for example, would apply styling to all elements with the `test` class.

JavaScript

1. What are examples of selection, iteration, and sequencing in the snake game?

Selection: the use of `if` statements to check whether the snake has wrapped around the canvas in the x direction (Line 60). Iteration: the use of the `forEach` higher-order method to loop through the snake's cells and draw on the canvas appropriately (Line 85).

2. How does ":root" contribute to the customization of the game?

The `:root` selector allows you to define CSS variables for use throughout the rest of the program.

3. Write 2-3 sentences about how the use of HTML, JavaScript, and CSS creates the final product.

HTML is used for laying out the elements of a site, CSS arranges and styles these elements, and JavaScript adds interactivity to these elements. Each of these 3 languages has different syntax—HTML is a markup language, CSS is a styling-based markup language, and JavaScript is more of a traditional, imperative/object-oriented language.

CPT

My CPT is not a website so this doesn't really apply to my project. If it was, I would add the Bootstrap resource to my HTML `<head>` and use some of the Bootstrap classes such as `container` to style my project.