Tag Archives: computer science

Web Design For Kids – Google Sites Features to Love

Web design for kids has never been as easy. Google Sites is an ideal app to construct fun, engaging, and useful websites for use in the classroom. Not only is Google Sites free with a Google account, but the tools are simple to use yet students can create professional looking results. Captivate interest and develop essential skills for the future by making websites with your students.

TechnoSite is an all new TechnoKids project that uses Google Sites to transform students into skilled web designers. In this TechnoKids project, they learn how to build a website that includes links to fun places for kids on the World Wide Web. Here are some of the nifty features that we like about web design for kids with Google Sites.

Insert Unique and Fun Elements

web design for kids

  • Themes
    When starting to make a web page, students can choose a theme. This creates a consistent, professional looking site. The font and color can also be chosen to create a one-of-a-kind design. However, there are a limited number of choices so that students are bogged down in making a decision.
  • Image Carousel
    This ‘gadget’ allows you to use a picture frame that with automatically display multiple images. Simply select two or more pictures and insert them into an image carousel. The website viewer can click the arrows to see each picture or it can be set to loop through the set of pictures automatically.
  • Layouts
    To add text and images, a selection can be made from the Layouts gallery. These preset designs contribute a polished, ‘expert’ look to the website.

Elementary students can make professional looking websites using Google Sites.

Customizable Web Page Banner

The banner at the top of the page can include text and a background image. There is a gallery of designs in Google Sites to choose from, or the web page creator can search for an image. Since it’s tricky to find a simple themed picture that looks great in the short and wide banner space, add the keyword wallpaper to the search term. Google Image Search narrows down the results to more appropriate images for the banner.

Set Navigation Mode

By default, the navigation bar automatically appears at the top right of the banner on the Home Page. Navigation settings can be adjusted to move the bar to the left side of the page. This is convenient if the layout or images look better if the page is narrower or simply if the designer wants to personalize the navigation settings.

Add a Logo to Create an Instant Color Theme

To make the website unique, a small logo can be added at the top left of the banner. Search for a simple small image or upload one to suit the webpage topic. The colors from the logo will be automatically used to produce a custom color theme.

Make Quick and Easy Changes

Want to change the order of the pages in the website? It’s easy: under the Page tab, just drag the pages to set the order you want. The navigation bar automatically adjusts too!

Test Responsive Design

With the extensive variety of devices that are commonly used to view web pages, it’s convenient to be able to preview how the website in different modes. When previewing the page, you can switch to see how it will look on a phone, tablet, and large screen. Compare how the layout changes depending on the screen of the device.

web design for kids

Responsive Design in Google Sites allows you to preview what the layout will look like on a wide screen, tablet, or phone.

Web Design for Kids Made Easy

Certainly Google Sites is an outstanding yet simple and intuitive tool for the classroom. The features are fun and powerful yet allow kids to create and publish projects that they will be eager to share. And TechnoSite is the all new TechnoKids project that empowers kids to build STEM skills using Google Sites. Find out more about TechnoSite here.

Computer Science and Technology Integration

Brain research tells us that learning really ‘sticks’ when activities are both meaningful to students as well as integrated in curriculum in an interdisciplinary approach. As well, students are motivated when they are actively discovering and investigating a problem.

computer science

Teach coding with Scratch to middle school and junior students to build computational thinking skills.

TechnoCode, the newest technology project developed by TechnoKids, was created specifically to spark an interest in computer science by engaging students. As they use Scratch to build programming skills, young learners construct a series of activities for kids. As game designers, they consider their users’ interests and abilities. They become authentic programmers who plan, code, and actually field test their unique creations.

The TechnoCode project is primarily a STEM project that teaches coding. However, the activities also integrate into other areas of curriculum including language arts, mathematics, social studies or science, visual arts, and music.

Computer Science

TechnoCode is an introduction to programming. The activities have students build algorithms that sequence commands, events, loops, and conditions. Use the project to target computer science learning outcomes. The project includes a detailed list of skills achieved in each Session, ideal as a teacher checklist for assessment.

Language Arts

The assignments in Session 1 and Session 4 can be integrated into curriculum as a language arts unit. In these assignments, students engage in visual storytelling. They create animated scenes and stories. To extend language arts learning outcomes, the concept of plot, setting, and characters is also applied when engineering games in Session 3 and 5.

Integrate coding into curriculum.

Integrate coding into curriculum.

Mathematics

Integrate TechnoCode into an existing problem-solving unit in Math class. The assignments are an ideal fit because coding requires mathematical and logical thinking. For example, placing sprites on the stage requires plotting ordered pairs, rotating objects involves knowledge of angles, and setting the size of sprites uses percentages. As well, logic is used to control when or if an action happens.

Social Studies or Science

Include The Session 4 Skill Review in TechnoCode as a creative way to showcase learning into another subject area. In this activity, students build an interactive diorama. It shows a scene from nature or a historical event that engages the viewer to click on objects to learn more. Complete the activity to have students share facts or create a simulation about a topic currently being studied. Samples provided include space exploration, tornado, and farming.

Visual Arts

Target visual arts learning outcomes with TechnoCode. Graphic design is interwoven throughout the activities. Students apply their creativity to paint or edit unique sprites and backdrops. They also apply their skills to engage the audience using visual elements. In addition, the Session 2 Extension Activity specifically has students draw artwork with a pen using code.

Music

Integrate TechnoCode into a music class. In the Session 3 Extension Activity, students invent an instrument. This activity is a fun way for students to express their musical talent.

programming

TechnoCode technology project teaches programming using graphical blocks.

Inspire your students to become coding ninjas with TechnoCode!

Teaching Ideas for Programming with TechnoCode

coding with Scratch

TechnoKids’ newest release is TechnoCode, a technology project that introduces coding with Scratch to elementary and middle school students. It is an ideal project for Grades 4 and up. Jam-packed with programming activities, TechnoCode sparks an interest in computer science. Step by step instructions explain how to build animations, stories, games, art, music, and simulations.

Empower students with real-world skills they can use in the workplace. The instructional materials in TechnoCode encourage students to think like programmers. Resources include sample videos to inspire imaginations, planning sheets with guiding questions to help design scripts, assessment tools to evaluate student work, and coding journal logs to reflect upon learning.

Ideas for Implementation

The TechnoCode project has students create animated scenes, construct mazes, broadcast stories, engineer games, design artwork, compose music, build a diorama, and more! The activities are suitable for any teaching situation. Select the option that works best for you and your students:

  • Coding Unit with Elementary Students: Assignments in Sessions 1-3 in TechnoCode are ideal for students new to Scratch. The activities are perfect for Grades 4 and up. Students design animations, create art, develop games, and compose music. The emphasis is on coding basics including how to build scripts, sequence commands, control action with if then conditions, and create simple loops. The activities focus upon directing movement, synchronizing sound, and understanding x and y coordinates.
  • Coding Unit with Middle School Students: Once students understand the fundamentals of coding in Sessions 1-3, they extend their learning in Sessions 4-6. The activities are ideal for students that understand the fundamentals and are ready for a challenge. The critical and computational thinking required is ideal for students in Grades 6-8. They produce a story, engineer a game, develop a treasure hunt, build a diorama, and remix a project. The emphasis is on having students manipulate the appearance of sprites, direct the timing of events with broadcasting, and create original artifacts using conditions, variables, and operators.
  • Scratch activities for kids.

    Build games using Scratch. Learn how to use variables to track the score.

  • Computer Science Course: TechnoCode has 25 assignments designed to ignite an interest in computer science. The focus is on thinking like a programmer. Each coding activity is divided into four parts – exploration, practice, freestyle, and reflection. Using a question and answer format, students discover the function of command blocks. Next, they follow guided instructions to build scripts. Afterwards, they apply their skills to complete open-ended challenges. Once a Scratch project is finished, students write a coding journal entry to reflect upon the experience.
  • Hour of Code: If you only have one class to teach coding there are many assignments in TechnoCode that can be used for this purpose. If your students are beginners, they can develop simple animations. Assignment 5 targets how to build a script, Assignment 6 explores directing movement, and Assignment 14 focuses upon changing the appearance of a sprite. If your students have existing knowledge of Scratch, the skill reviews in Sessions 2-5 are excellent challenges.
  • Coding Workshop Series: If you are running a workshop series as part of an after-school program or community event, then you will need to select assignments that fit the number of classes offered. As well, consider the age range and coding abilities of students.

Coding with Scratch is highly addictive and fun! Your students will develop a host of essential technology skills as they create unique games, interactive stories, animations, and more!

Add the A to STEM Education

Educators agree that STEM education is essential to prepare students for the challenges of the 21st century workforce. The skills they learn in science, technology, engineering, and math subject areas also develop vital skills necessary for success: critical thinking, creativity, problem solving, and collaboration. Although there’s quite a debate about whether the A for the arts needs to be added to STEM to make STEAM or if it’s already there inherently, it’s evident that fine arts, language, and music play a key component in a curriculum to prepare young people to face the complex challenges of the future.

steam career readiness

The Arts are a vital part of STEM education

Education Models for the Future

Traditional school curriculum segregates studies into separate subject areas. However, project-based learning is an instructional approach that blends subjects. Students are faced with an authentic, meaningful, real world challenge. And these are non-Googleable questions! Students investigate a problem and propose viable solutions in an interdisciplinary study. Technology is commonly used as a tool. Whatever skills are required to solve the problem – math, science, language arts – must be learned and mastered. Students need to be able to think innovatively, plan, create, and communicate the resulting project. Usually STEM subject areas are needed, and students build valuable job skills such as computational thinking, initiative, perseverance, and communication.

Where Do the Arts Appear?

To answer these ‘big’ project-based challenges, students need to integrate the arts. Creative thinking and design are a central part of innovation. Being able to imagine an outcome, visualize a product, or communicate an abstract idea requires artistic skills integrated with multiple STEM skills.

Here are a couple of examples of the arts integrated with STEM in the real world:

STEM Education requires the Arts

  • Product Design
    Designing an innovative product may require engineering, mathematical, and scientific problem solving. But it also needs an attractive appearance to make an emotional connection to consumers. These are artistic decisions.
  • Advertising
    When a new product is brought to the market, communication skills are essential. Advertisers excel in persuasive writing. In addition, the creation of new logos requires a knowledge of graphic design. The success of a venture often depends on artistic choices.
Arts and STEM education

Infuse the arts into STEM education.

The Arts in Computer Science

We’ve been working with Scratch recently to develop a STEM project, TechnoCode, that teaches coding skills. The students will learn programming skills as they make animations, games, or interactive stories.

Coding design decisions should be engaging so that the user who interacts with the finished product is intrigued and captivated. Also, artistic choices affect if the project is user friendly and fun to play. Some of the stylistic choices students need to make when programming include:

  • Drawing custom characters
  • Designing backgrounds
  • Adding sensory cues – motion, sound, visual – to build interest, express an idea, and hook the user
  • Creating “Game over” messages that encourage and entice the user to try again
  • Making scoring and timing decisions using aesthetic choices that appeal to players

The brainstorming, problem-solving, and decision making involved in programming demand innovation and ingenuity in design choices. To foster the trailblazers of tomorrow, STEM education needs to acknowledge and incorporate the arts.