Activity 4.2 Developing A Website

Group Activity for Module 4
Objectives: To work together as a team in applying web design principles and elements using online
creation tools, platforms, and applications to communicate a message for a specific
purpose in specific professional tracks.
: To create an original or derivative ICT content using online creation tools, platforms, and
applications to effectively communicate messages related to specific professional tracks
Task 1: Deciding and preparing the elements and the details that will be incorporated in the website.
Objective: To be able to apply the principles and elements of design in choosing what details will be
included in the website.
1. Your group will be creating a website for an upcoming major event for the topic you chose in
Module 3, specific to your strand.
2. Decide on all the details that should be provided in the website. Details should include but not
limited to the following:
a. Title of the event
b. Date
c. Venue
d. Contact Information
3. Choose a theme for the website. Consider the following when deciding on the theme
a. Principles of Web Design (Balance, Contrast, Emphasis, Rhythm and Unity)
b. Elements of Web Design (Line, Shape, Texture, Color, Size, Space and Value)
4. Based from the chosen theme, collect and prepare all images that you plan to include in the
website.
Task 2: Preparing the links that will be incorporated in the website through the online creation tools,
platforms and application. Particularly for online presentations, cloud computing, mapping, social media
and online forms.
Objective: To create content using online creation tools, platforms and applications.
*Note that for all activities requiring the use of google tools and applications, you have to login using
your google account.
A. Create a registration form for those who will be attending the event using google forms.
1. The forms should include the following information:
 First Name
 Last Name
 Age
 Gender
 Email Address
 Mailing Address
 Contact Number
2. Create the form by opening the Forms home screen at forms.google.com.
3. In the top left, under "Start a new form," click New .
4. A new form will automatically open.
5. After you've created the form, change title to Registration Form. You can add the items
specified and set them to require short answer. (Found on the right side of the
question/item)
6. Set that all items are required to be answered.

7. Save the form and copy the link (URL) in the address box.
8. To shorten the URL, go to Google URL shortener site at goo.gl. Paste your URL to the Your
original URL here box. Click Shorten URL. Copy the shortened URL.
B. Prepare a short presentation about the event using Prezi

1. Presentation should include an introduction about the topic or organization. Major details
about the event such as title, date and venue should also be presented.
2. Save the presentation.
3. Click on the Your Prezis button, and select the Prezi you wish to share.
4. At the bottom of the screen, click the Share button.
5. Click the Embed tab. Then click the Copy Code to Clipboard button.
C. Upload the infographics created from Module 3 in either Google Drive or Dropbox
1. For Google Drive
 Log into the Google Drive website. Visit drive.google.com and log in with your
Google account. You'll be taken to your Drive files.
 Click the "NEW" button. You'll find this in the upper-left corner.
 Select "File Upload" or "Folder Upload." This will allow you to upload a single file to
drive or an entire folder.
 Select the file or folder you want to upload.
 Wait for your file or folder to upload. You'll see a progress bar in the lower-right
corner that will let you know how far along the upload process is. The time the
upload takes will vary depending on the size and number of files you're uploading,
as well as the speed of your connection.
 Open the home screen for Google Drive
 Click Share or Share .
 At the top right, click Get shareable link.
 Next to "Anyone with the link," click the Down arrow .
 To choose what someone can do with your file, click the Down arrow . Choose
View.
 Copy the link.
2. For Dropbox
 Sign in to the Dropbox website.
 Click the Upload button at the top of the window.
 A window will appear. Click the Choose File button and then select the file on your
computer that you'd like to add to your Dropbox.
 Click the Start Upload button. Your files will start uploading, and you'll see a
progress indicator.
 Right-click the file.
 Choose Share...
 Click Create link.
 Click Copy link.
D. Copying the link of your facebook page

1. Login to your facebook account and open the facebook page created from Module 3.
2. Click on the address box and copy the URL of your facebook page.
E. Determine the exact location in google maps

1. Open Google Maps (https://www.google.com/maps.)
2. Search for the exact address of the location of your event.
3. Copy physical address returned by Google Maps.
Task 3: Developing a website using online templates

Specific Objective: To be able to apply web design principles and elements using online creation tools.
1. Go to weebly.com. Login with your account.
2. Select a theme, in this case select Event. Based from your discussion as a group, choose among
available templates under Events.
3. After selecting a theme, you may click on start editing.

4. Embed the element that you prepared in Task 1. Change the title and include the text related to
the event. Add in the pictures as well. Refer to the example on the next page.
From this:
To this:
5. Continue filling out the details for the event website. Once done, start embedding other
elements.
6. Embed a Map by clicking on the Map on the side bar. Drag and decide the placement of the Map
in your website.
7. Click on the map and paste the exact address of the venue of the event you collected from
Google Maps in Task 2. Paste it in the address box.
8. You will now embed all the links prepared from Task 2 in your website by clicking on Embed
Code from the Basic sidebar. Drag the embed code where you want the link to appear. For
purpose of demonstration, it’s place under the purchase ticket.
9. Click on the Click to set custom HTML, a window will be displayed, Click on Edit Custom HTML.
You will be provided an area for typing your code. Delete the content and replace with the
following HTML code:
Click <a href="YOUR URL HERE ">HERE</a> to go to Registration.
Replace YOUR URL HERE with the shortened URL for your google form (from Task 2, A)
You will notice that word HERE is in orange which indicates that it’s a link.
10. Repeat the procedure for the following links:

a. Presentation from PREZI
b. Uploaded file from Google Drive or Dropbox
c. Facebook Page
Use the corresponding URLs from Task 2, B, C and D respectively.
11. Once all components are placed in the event website you can now publish.

Activity 4.2 Developing A Website

Uploaded by

Copyright:

Available Formats

Activity 4.2 Developing A Website

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Activity 4.2 Developing A Website

Uploaded by

Copyright:

Available Formats

What are the steps to create a registration form using Google Forms?

What are the steps to embed a presentation using Prezi?

Group Activity for Module 4

6. Set that all items are required to be answered.

B. Prepare a short presentation about the event using Prezi

D. Copying the link of your facebook page

E. Determine the exact location in google maps

Task 3: Developing a website using online templates

3. After selecting a theme, you may click on start editing.

10. Repeat the procedure for the following links:

You might also like