EMPOWERMENT TECHNOLOGIES

Grade 11 Week 3
First Quarter 1st Semester
WORK SHEETS

NAME: Rainier E. Cabuco GRADE-SECTION: 11 - ICT A

SUBJECT TEACHER: ____________________________________ TEACHER CODE: _____________
DATE OF SUBMISSION:__________________________________ CONTACT NO: ________________

Lesson 3: Principles and Techniques of Design Using

Online Creation Tools, Platforms, and Applications
Module 3 Pages: 1-25

What’s New
Activity 1
List down at least 5 examples of Social Media List down at least 5 examples of the Blogging
platforms. Platform.
1Social networking 1WordPress.com.
2Microblogging 2Blog.com.
3Photo sharing 3TypePad Micro.
4Video sharing 4Tumblr.
5Social Blogging 5LiveJournal.

Activity 2
Among the two mentioned online platforms which do you think is more superior? Why?
The top two online platforms are social networking because more and more people are selling anything
online, and the second is video sharing because more people are being helped by sharing online they are
already doing the things they need to know just like youtube just a search will show you everything you
want
Superior Social Media platform: I believe SOCIAL MEDIA platforms are superior. It has the ability to
reach the most number of people on a regular basis. The fact that people can put anything online for free
today creates the most attractive means of showing everything you want.

Blogging platform:are broadcast-style communications systems that enable authors to publish articles,
opinions or product reviews (known as posts), which can be delivered through stand-alone websites,
email, feed syndications systems and social networks.

What’s More: Read and answer each question concisely

1. What are the different online platforms that can be used for ICT content development?
1. Computing Platforms 4. Content Crowdsourcing Platforms
2. Utility Platforms 5. On-demand Service Platforms
3. Technology Platforms 6. Data Harvesting Platforms

2. Differentiate the different online platforms available to be used for ICT content development.
a. Presentation/Visualization - as the word suggests is the art of representing information in visual form
like diagrams, charts or images. The visuals are usually supported by narration from the presenter.
b. Cloud Computing -is the on-demand availability of computer system resources, especially data storage
(cloud storage) and computing power, without direct active management by the user. The term is
generally used to describe data centers available to many users over the Internet.
c. Social Media - are interactive Web 2.0 Internet-based applications. User-generated content—such as
text posts or comments, digital photos or videos, and data generated through all online interactions—is
the lifeblood of social media.
d. Web Page Creation - A well-designed website can help you form a good impression on your
prospective customers. It can also help you nurture your leads and get more conversions. But, more
importantly, it provides good user experience and helps your website visitors access and navigate your
website with ease
e. File Management - is the process of administering a system that correctly handles digital data.
Therefore, an effective file management system improves the overall function of a business workflow. It
also organizes important data and provides a searchable database for quick retrieval.
f. Mapping - is making a map, or a matching process where the points of one set are matched against the
points of another set. An example of mapping is creating a map to get to your house.

3. Among the mentioned Online Platform for ICT development which do you think is more
superior? Why?
the most evolving online platform is social media because many people already use it and many know
how to use it. And it really helps, in any field of work, business or even education so I can say it further
strengthens online platforms

What I Can Do
1. Create a Venn diagram to compare and contrast Social Media Platforms and Blogging Platform

Blogging Platforms

-Blogging creates content that lives on your website

Social Media Platforms

-Social media engages with people about content

Similarities

-They are both platforms

What is it?
Activity: Web Design Quality Check
Directions: Use the Internet to research on the designated topics depending on your track:
A. COVID Vaccine (STEM students) D. Negosyo, Trabaho o Kolehiyo (TVL Students)
B. Life of an Entrepreneur (ABM students) C. Depression in Teenager (HUMSS students)

Once you find the website, evaluate the website using the checklist below. Copy the checklist in your
notebook. Name of Website:World Health Organization
Website URL: https://www.who.int/news-room/q-a-detail/coronavirus-disease-(covid-19)-vaccines?
adgroupsurvey={adgroupsurvey}&gclid=CjwKCAiAgc-ABhA7EiwAjev-jyrzj0ZVJJMNiBxawb4TT6KeGv-
Im3uifBfJi3iiGr4l4Yv9pnplAxoCh7wQAvD_BwE

YES NO CRITERIA
CONTENT EVALUATION
/ The contents of the website valuable and relevant to my research topic.
/ The contents are readable.
/ The information that the website contains is valid and true.
/ The website is free from misspelled words and grammatical errors.
PURPOSE EVALUATION
/ Did the website achieve its purpose of giving information in accordance to its theme?
IMAGE AND COLOR QUALITY EVALUATION
/ The website uses custom images that are in consistent size and quality throughout website.
/ The primary header image is in high-resolution.
The colors used are harmoniously and logically related.
FONT CONSISTENCY AND READABILITY
/ The font sizes used for each of the primary elements of the page is consistent all throughout.
/ The font spacing is consistent.
/ The fonts are readable.
/ The website follows the F-shaped pattern.
ACCESSIBILITY TO MOBILE DEVICES
/ The website can be accessed using smartphones.
The layout in the smartphone is easy to navigate.

What I Can Do
Direction: Search for a blog on why incoming SHS students must choose your track. Answer the following
questions:
1. What can you say about the text layout, use of graphics and multimedia?
All I can say about the layout of the text, the use of graphics and multimedia is that the texts are just fine
and the graphic is beautiful and of course as well as the multimedia
2. How about the content and creativity of the blog?
About the content and creativity of the blog depends on the creator and reader of it. but I can say it is
beautiful
3. Did the blog follow the principles of web and graphics design? Briefly explain.
I noticed that the manufacturer adheres to the principles of web and graphics design so I can say that it
is beautiful.

LECTURE:
MOST ESSENTIAL LEARNING COMPETENCIES Evaluate existing online creation tools, platforms and
applications in developing ICT content for specific professional tracks.
DEFINITION OF TERMS
Online Platform- is technologies that are grouped to be used as a base upon which other applications
processes or technologies are developed.
Presentation/Visualization- communicates information clearly and efficiently via statistical graphics,
plots and information graphics.
Cloud Computing- the practice of using a network of remote servers hosted on the internet to store,
manage, and process data, rather than a local server or a personal computer.
Social Media- are computer-mediated tools that allow people, companies and other organizations to
create, share, or exchange information, career interests, ideas, and pictures/videos in virtual
communities and networks.
Web Page Creation- encompasses a number of important elements including color, layout, and overall
graphical appearance.
File Management- is the storing, naming, sorting and handling computer files.
Mapping- a transformation taking the points of one space into the points of the same or another space.

What’s In
Basic principles of graphics and layout include balance, emphasis, movement, pattern, repetition and
rhythm, proportion, and variety. Balance deals with the visual weight of objects, texture, colors, and
space. Emphasis is the area designed to attract the viewer’s attention. Movement guides the viewer’s
eye around the screen. Pattern, repetition, and rhythm are visual elements that are repeated to create
unity in the layout of the image. Proportion includes visual elements that create a sense of unity where
they relate well with one another. Lastly, the various use of several design elements to draw the viewer’s
attention. Online Platform is technologies that are grouped to be used as a base upon which other
applications processes or technologies are developed some of the examples of an online platform are
Presentation/Visualization, Cloud Computing, Social Media, Web Page Creation, File Management and
Mapping.

Online Platforms for ICT Content Development

Online Platform is technologies that are grouped to be used as a base upon which other applications
processes or technologies are developed
Examples of Online Platform
a. Presentation/Visualization
b. Cloud Computing
c. Social Media
d. Web Page Creation
e. File Management
f. Mapping
A. PRESENTATION / VISUALIZATION- communicates information clearly and efficiently via statistical
graphics, plots and information graphics
Examples of Presentation/ Visualization
Prezi – helping to reinvent the art of presentation
Zoho – an online project management app that helps you plan your work and keep track of your
progress
SlideShare – to build quickly from concise, well presented content from top experts
MindMeister – an online mind-mapping tool that lets you capture, develop and share ideas visually

B. CLOUD COMPUTING- the practice of using a network of remote servers hosted on the internet to
store, manage, and process data, rather than a local server or a personal computer
Examples of Cloud Computing:
Google Drive – keep all work in one secure place with online file storage
Dropbox – keeps your files safe, synced, and easy to share

C. SOCIAL MEDIA- are computer-mediated tools that allow people, companies and other organizations
to create, share, or exchange information, career interests, ideas, and pictures/videos in virtual
communities and networks
Examples of Social Media
• Twitter – online social networking service that enables users to send and read short 140- character
messages called “tweets”.
• Facebook – is for-profit corporation and online social networking service

D. WEB PAGE CREATION- encompasses a number of important elements including color, layout, and
overall graphical appearance.
Examples Web Page Creation
• Wix -a cloud-based web development platform that allows users to create HTML5 websites and mobile
sites through the use of their online drag and drop tools
• Weebly – a web-hosting service featuring a drag and-drop website builder.

E. FILE MANAGEMENT- is the storing, naming, sorting and handling computer files
Examples of File Management
• Zamzar – web application to convert files
• word2pdf – convert Word files to PDF (Portable Document Format) with this online tool
F. MAPPING- a transformation taking the points of one space into the points of the same or another
space.
Examples of Mapping
• Google Maps – a desktop web mapping service developed by Google
CONTENT MANAGEMENT SYSTEM (CMS) - is a computer application (sometimes online or browser
based) that allows you to publish, edit and manipulate, organize and delete web content. CMS is used in
blogs, news websites, and shopping
BLOGS- is a discussion or informational website published on the web consisting of discrete, often
informal diary-style text entries ("posts"). Posts are typically displayed in reverse chronological order, so
that the most recent post appears first, at the top of the web page
Examples of Blogging Sites:
• WordPress (wordpress.com)
• Blogger (blogger.com or blogspot.com)
• Medium.com
• Squarespace.com
• Tumblr

What’s In
Web Page Creation
While it is easy to build a web page, it's hard to make it look right. If all you want is plain text, everything
will be too straightforward. The tricky part is when you want something more. Most bad web pages are
bad because of their design rather than their contents. The more stuff on the page, the messier it gets
and the less likely you are to keep the interest of the visitor
(http://billconner.com/techie/webpages.html). An effective website design should fulfill its intended
function by conveying its message while simultaneously engaging the visitor. Several factors such as
consistency, colors, typography, imagery, simplicity, and functionality all contribute to good website
design. A well-designed website can help build trust and guide visitors to act. Creating a great user
experience involves making sure your website design is optimized for usability (form and aesthetics) and
how it easy is it to use (functionality). (https://www.feelingpeaky.com/9-principles-ofgood-web-design/).

WEB TEMPLATES and “WYSIWYG” PLATFORMS

“WYSIWYG” means What You See Is What You Get. In this kind of platform, no coding skills are required.
Instead, you manipulate with design components using an editor window and get the chance to choose
what elements are on your page.
Web Templates
These are unique full-page layout that contains generic information which can be replaced by the users
with their own personal information.

BASIC WEB DESIGN PRINCIPLE

Website Purpose
Your website needs to accommodate the needs of the user. Having a simple clear intention on all pages
will help the user interact with what you have to offer. Are you imparting practical information like a
‘How to guide’? Is it an entertainment website like sports coverage or are you selling a product to the
user? Below are the common core purposes of websites:
✓ Describing expertise
✓ Building reputation
✓ Generating leads
✓ Sales and after care

Simplicity
Simplicity is the best way to go when considering the user experience and the usability of your website.
Below are ways to achieve simplicity through design.
✓ Color - it has the power to communicate messages and evoke emotional responses. Finding a color
palette that fits your brand will allow you to influence your customer’s behavior. Keep the color selection
limited to less than 5 colors. Pleasing color combinations increase customer engagement and make the
user
feel good.
✓ Typography or the text used. Typefaces should be legible and only use a maximum of 3 different fonts
on the website.
✓ Imagery is every visual aspect used with communications. This includes still photography, illustration,
video and all forms of graphics.
Navigation
Navigation is the way finding system used on websites where visitors interact and find what they are
looking for.
Website navigation is key to retaining visitors. If the websites navigation is confusing visitors will give up
and find what they need elsewhere. Keeping navigation simple, intuitive and consistent on every page is
key.
F-Shaped Pattern Reading
The F- based pattern is the most common way visitors scan text on a website. Eye tracking studies have
found that most of what people see is in the top and left area of the screen. The F’ shaped layout mimics
our natural pattern of reading in the West (left to right and top to bottom). An effective designed website
will work with a reader’s natural pattern of scanning the page.
Visual Hierarchy
The arrangement of elements is order of importance. This is done either by size, color, imagery, contrast,
typographically, whitespace, texture and style. One of the most important functions of visual hierarchy is
to establish a focal point; this shows visitors where the most important information is.
Content
An effective web design has both great design and great content. Using compelling language great
content can attract and influence visitors by converting them into customers.

Grid Based Layout

The grid-based layout arranges content into a clean rigid grid structure with columns, sections that line
up and feel balanced and impose order and results in an aesthetically pleasing website.
Load Time
Waiting for a website to load will lose visitors. Nearly half of web visitors expect a site to load in 2
seconds or less and they will potentially leave a site that isn’t loaded within 3 seconds. Optimizing image
sizes will help load your site faster.
Mobile Friendly
More people are using their phones or other devices to browse the web. It is important to consider
building your website with a responsive layout where your website can adjust to different screens.

ONLINE CREATION TOOLS

Types of Visual Content
Visual content is great because it powers up your communication and receives great attention from the
target audience.
✓ Infographics are graphic visual representations of information, data, or knowledge intended to present
information quickly and clearly. They can improve cognition by utilizing graphics to enhance the human
visual system's ability to see patterns and trends.
✓ Videos are recording of moving pictures and sound, especially as a digital file.
✓ Presentations use catchy images, videos, and graphics in your presentation to get into the minds of
your target audience.
For Infographics
✓ Piktochart is an infographic creation tool that lets you design stunning pieces worth sharing in
minutes.
For Videos
✓ PowToon. The online animation software of PowToon is perfect for storytelling and creating Flash-style
movies. You don’t have to go through hundreds of tutorials to learn motion creation as PowToon will do
it for you.
✓ YouTube Video Editor is simple and with a single-track timeline, you get all the basic transitions and
effects and a soundtrack feature. It is easy to learn and quick to use. Users can edit and remix the
YouTube videos that are uploaded in their YouTube accounts.
For Presentation
✓ Prezi is cloud-based presentation software that is simple to use as compared to the traditional
slideshow makers. It displays information not as series of slides but as a large board that zooms in on
specific information, text, or an image, giving presentations a fresh and nontraditional feel.
✓ SlideShare. You can use this to upload and share professional videos and slide presentations.
For Web Site Creations
✓ Wix you can use this to create your web site or mobile site.
For Blogging
✓ WordPress.org the self-hosted version of WordPress is, by far the most popular blogging platform in
the world. WordPress powers over 90 percent of all the blogs on the Internet.
✓ Blogger.com This free blog hosting service has been around for a long time. It was founded in 1999
and acquired by Google in 2003. You can sign up easily with your existing Google account.