SlideShare a Scribd company logo
1 of 22
Participatory news
“Then we [you, the reader, and I, the author] come together to make
this book, to feel this experience.”
“Writing and reading are not that distinct for the writer..”
-Conversations with Toni Morrison
For news curation, one of many ways to success is to personalize the
news and include reactions that would entail more reactions.
• We will finish MUSE exercise today.
By next Tuesday, create tumblr account.
• Send the links to me via email.
• Tutorial video.
<Create tumblr and embed into Muse>
https://www.youtube.com/watch?v=gXV5Zapn8cE
Examples of draft layout in drawing.
• http://www.radiatedigital.com/the-web-design-process-from-first-
concept-to-final-draft/
• http://www.yourinspirationweb.com/en/how-to-present-the-draft-
to-the-client-tips-and-examples/
• http://www.wikihow.com/Create-Your-First-Website
Continue with Muse: Working with Text
• Import and place text. Your bio, for example.
1. Let’s give it a title. New color, size.
2. Change track and leading of the body.
3. Select font.
Standard font
Select from Type kits: New set, Cubano sharp and so on.
Select from Edge font
Explore Self hosted font.
Set a style so that you don’t have to do the
work over and again.
• Use paragraph style
Set up a heading style
Set up a body style.
Adding Navigation
• Go to widget library. Names are synchronized
• Get subpage by clicking All page. Adjust other options
• Change text, color of menu boxes.
(Select a box. Make sure edit together is checked.
Go to Fill at the top and select a color)
• Try menu with texts only.
(Go to Fill at the top and select no color)
• Change the states. Window>states, make sure you have edit together checked.
-Normal
-Rollover
-Mouse down
*Study other websites and learn them.
Add navigation (menu) in three formats.
1. Navigation with texts only.
Select a box. Make sure edit together is checked.
Go to Fill at the top and select no color.
Adjust the font and color of your page names.
2. Navigation with boxes.
Select a box. Make sure edit together is checked.
Go to Fill at the top and select a color.
Adjust the font and color of your page names.
3. Navigation with other shapes.
Create a shape first. And then add navigation with no color.
Inserting HTML
• Insert Youtube.
• Storify
• Google map
Inserting shapes
A.Setting and deleting guides.
B.Adding background image.
•-browser fill
•-add image
•-Scale to fill
•-Position
•-Scroll checked
Other changes
Rectangle: Drag. Round up. Other shapes should be created outside.
•*Corner radius
Color
•-Fill: Solid/Gradient, Opacity, Color, Add image
•Gradient: Two colors, Focal point, direction, Size
•-Stroke: weight, center, outside, inside
Stacking objects
•-select and right click, arrange, send backward/bring to front
•-In panel use layers.
Aligning objects.
Add effects.
Format contact page.
• Use widget library
• Drag simple forms and place
• For additional change on the page, watch tutorial.
• https://helpx.adobe.com/muse/how-to/muse-create-simple-
form.html
Slideshow using widgets
• Open widget library> slideshow
• Click, drag and drop thumbnail.
• Click blue arrow
• Add image
• Adjust the size of thumbnail
• Unclick counter, previous and next.
• Adjust captions
• Select text and type in text
• Test in preview mode.
Link to your document (resume)
• Use Hyperlink to the online material or other pages.
-Select the texts.
-On the upper right corner select hyperlink.
-type in URL.
• Or embed the PDF document itself to the webpage.
-You can use online PDF embedder.
-Scribd.com
-Get the embed code.
-Drag and place it on the webpage.
You can also upload files directly to MUSE
• 1. Add this PDF file to assets folder of Muse from File > Add file for Upload.
• 2. Muse will take you to the windows explorer or finder and you need to
find the PDF file and select it.
• 3. Once the file is selected you will be able to see it in Assets panel. You can
enable assets panel from Windows > Assets
• 4. Now create a rectangle or text box on which you want the visitor to click.
• 5. Select that rectangle or text box and open hyperlink tab and select the
file below the file section of the dropdown.
• 6. Upload the entire website to your host.
• 7. Test it.
Different types of resume page.
• 1. Typing and linking
• http://www.lamivo.com/resume.html
• 2. Screen capture and download
• http://www.megangtalley.com/resume.html
• 3. Make it into subpages
• http://mattwyatt.org/cv/professional-experience/
• 4. Designed interactive page
• http://maceykateherges.wix.com/maceykateherges#!resume/c16wr
Get other things you want in the front page
or all the pages.
• Twitter feed.
• Social media buttons
-try using widgets.
-try using Photoshop. You can draw them yourself.
Or, You can use free websites for icons.
https://colorlib.com/wp/free-flat-social-media-icons-sets/
Or
http://www.dreamstale.com/free-download-72-vector-social-media-
icons/
Logo with photoshop
• Basic logo with texts.
“Simple logo”
http://www.genesisclub.training/1682/how-to-make-a-text-logo-in-
photoshop/
Other simple versions with photoshop
http://webriti.com/how-to-make-simple-logos-using-adobe-
photoshop-cs3/
http://www.makeuseof.com/tag/how-to-create-a-simple-blog-logo-in-
photoshop/
Logo with drawing.
https://www.youtube.com/watch?v=V2xs7GqdUwQ
30 examples of logo tutorials
• http://designscrazed.org/photoshop-logo-design-tutorials/
• Step by step.
Step 1
• Open a new Photoshop file that is 8 by 10 wide with high image resolution settings (300 dpi or higher).
Although you will rarely use a logo this size, quality is retained when shrinking. You can not enlarge small
files without losing quality.
Step 2
• Select the Text Tool from the left palette designated with a "T" in the box. Center the cursor and type in the
company name. Adjust the fonts through the font palette that appears in the upper right corner with the
Text Tool to play with font types, sizes and colors until you are happy with the way the company name looks.
Step 3
• Create a new layer by selecting "New Layer" from the drop-down menu along the top of the program. You
will want to create a new layer for each step; this gives you the ability to move or change certain elements
while keeping others. Keep track of layers in the box on the lower right side of the screen--the bold item is
the layer you are working on with any item that has an "eye" icon next to it is seen on the screen.
Step 4
• Type a title for your logo in the new layer using the Text Tool once
again. Use the font palette to change the font, length and height--for
example, stretching the title.
Step 5
• Import any graphic designs or pictures you have royalty free rights to
and want to use in the logo. You can find images from stock footage
libraries or clip art files. If you have no artwork yet, you can "draw" it
into a new layer using any of the following tools: Pencil, Shape or
Paintbrush.
Step 6
• Move elements from each layer around on the logo by clicking on the layer
menu on the lower right and selecting the layer you want to work on. You
can link layers by clicking on the box under the chain link icon or only view
the layer you are working on by clicking on the eye icon to remove it from
view.
Step 7
• Add effects, such as bevels, shadows, or color gradients. Use the Effects tab
on the drop-down menu at the top of the screen to choose the effects you
want to try. A preview will be given before the change is made
permanently.
Step 8
• Save your file as a *.psd and a*.jpg . The *.psd is your original Photoshop
file with all layers; keep this so you can make changes at a later point if you
want to. The *.jpg is a combined file with all element layers combined into
one making it a smaller file easier to email to print shops.

More Related Content

What's hot

Student's portfolio's creation
Student's portfolio's creationStudent's portfolio's creation
Student's portfolio's creationThanavathi C
 
L Hayes Online E Portfolio
L Hayes Online E PortfolioL Hayes Online E Portfolio
L Hayes Online E PortfolioLori
 
Creating a prezi handout
Creating a prezi handoutCreating a prezi handout
Creating a prezi handoutabeldridge
 
Firecoresoft slideshow fairy user guide
Firecoresoft slideshow fairy user guideFirecoresoft slideshow fairy user guide
Firecoresoft slideshow fairy user guideamalejackie
 
WeeblyTrainingManual
WeeblyTrainingManualWeeblyTrainingManual
WeeblyTrainingManualGracie Wardin
 
Glogster tutorial2011
Glogster tutorial2011Glogster tutorial2011
Glogster tutorial2011Karen Brooks
 
Intro to Flash 8 welcome & course outline (2008)
Intro to Flash 8 welcome & course outline (2008)Intro to Flash 8 welcome & course outline (2008)
Intro to Flash 8 welcome & course outline (2008)Matteo Wyllyamz
 
How to create a transparent background in photoshop
How to create a transparent background in photoshopHow to create a transparent background in photoshop
How to create a transparent background in photoshopClipping Path Arts
 
Adobe Photoshop CS4 Essentials welcome & course outline (2010)
Adobe Photoshop CS4 Essentials welcome & course outline (2010)Adobe Photoshop CS4 Essentials welcome & course outline (2010)
Adobe Photoshop CS4 Essentials welcome & course outline (2010)Matteo Wyllyamz
 
How to create an PowerPoint presentation
How to create an PowerPoint presentationHow to create an PowerPoint presentation
How to create an PowerPoint presentationAbdus Salam
 
Computer Generated Flannel Boards
Computer Generated Flannel BoardsComputer Generated Flannel Boards
Computer Generated Flannel BoardsFantasy BookLover
 
Computer Course Digital Classroom Tools Notes Unit 1, 2, & 3/Dr.C.Thanavathi
Computer Course Digital Classroom Tools Notes Unit 1, 2, & 3/Dr.C.ThanavathiComputer Course Digital Classroom Tools Notes Unit 1, 2, & 3/Dr.C.Thanavathi
Computer Course Digital Classroom Tools Notes Unit 1, 2, & 3/Dr.C.ThanavathiThanavathi C
 
Introduction to PowerPoint 2007
Introduction to PowerPoint 2007Introduction to PowerPoint 2007
Introduction to PowerPoint 2007misscrawleymfl
 
DAY 2 - Starting in Photoshop (Images and Layers)
DAY 2 - Starting in Photoshop (Images and Layers)DAY 2 - Starting in Photoshop (Images and Layers)
DAY 2 - Starting in Photoshop (Images and Layers)Sef Cambaliza
 
Adobe Photoshop CS6 tutorial 2013
Adobe Photoshop CS6 tutorial 2013Adobe Photoshop CS6 tutorial 2013
Adobe Photoshop CS6 tutorial 2013Jessie Doan
 
Powerpoint slide
Powerpoint slidePowerpoint slide
Powerpoint slideT_design
 

What's hot (20)

Student's portfolio's creation
Student's portfolio's creationStudent's portfolio's creation
Student's portfolio's creation
 
L Hayes Online E Portfolio
L Hayes Online E PortfolioL Hayes Online E Portfolio
L Hayes Online E Portfolio
 
Creating a prezi handout
Creating a prezi handoutCreating a prezi handout
Creating a prezi handout
 
Firecoresoft slideshow fairy user guide
Firecoresoft slideshow fairy user guideFirecoresoft slideshow fairy user guide
Firecoresoft slideshow fairy user guide
 
Button
ButtonButton
Button
 
WeeblyTrainingManual
WeeblyTrainingManualWeeblyTrainingManual
WeeblyTrainingManual
 
Glogster tutorial2011
Glogster tutorial2011Glogster tutorial2011
Glogster tutorial2011
 
Intro to Flash 8 welcome & course outline (2008)
Intro to Flash 8 welcome & course outline (2008)Intro to Flash 8 welcome & course outline (2008)
Intro to Flash 8 welcome & course outline (2008)
 
How to create a transparent background in photoshop
How to create a transparent background in photoshopHow to create a transparent background in photoshop
How to create a transparent background in photoshop
 
How to Make a powerpoint
How to Make a powerpointHow to Make a powerpoint
How to Make a powerpoint
 
Adobe Photoshop CS4 Essentials welcome & course outline (2010)
Adobe Photoshop CS4 Essentials welcome & course outline (2010)Adobe Photoshop CS4 Essentials welcome & course outline (2010)
Adobe Photoshop CS4 Essentials welcome & course outline (2010)
 
How to create an PowerPoint presentation
How to create an PowerPoint presentationHow to create an PowerPoint presentation
How to create an PowerPoint presentation
 
Computer Generated Flannel Boards
Computer Generated Flannel BoardsComputer Generated Flannel Boards
Computer Generated Flannel Boards
 
TUTORIAL ON PHOTOSHOP
TUTORIAL ON PHOTOSHOPTUTORIAL ON PHOTOSHOP
TUTORIAL ON PHOTOSHOP
 
Computer Course Digital Classroom Tools Notes Unit 1, 2, & 3/Dr.C.Thanavathi
Computer Course Digital Classroom Tools Notes Unit 1, 2, & 3/Dr.C.ThanavathiComputer Course Digital Classroom Tools Notes Unit 1, 2, & 3/Dr.C.Thanavathi
Computer Course Digital Classroom Tools Notes Unit 1, 2, & 3/Dr.C.Thanavathi
 
Introduction to PowerPoint 2007
Introduction to PowerPoint 2007Introduction to PowerPoint 2007
Introduction to PowerPoint 2007
 
DAY 2 - Starting in Photoshop (Images and Layers)
DAY 2 - Starting in Photoshop (Images and Layers)DAY 2 - Starting in Photoshop (Images and Layers)
DAY 2 - Starting in Photoshop (Images and Layers)
 
Adobe Photoshop CS6 tutorial 2013
Adobe Photoshop CS6 tutorial 2013Adobe Photoshop CS6 tutorial 2013
Adobe Photoshop CS6 tutorial 2013
 
Lms
LmsLms
Lms
 
Powerpoint slide
Powerpoint slidePowerpoint slide
Powerpoint slide
 

Similar to Digital portfolio 2 navigation, html, blog, logo

G8 Term 2 other handouts and notes
G8 Term 2 other handouts and notesG8 Term 2 other handouts and notes
G8 Term 2 other handouts and notesGhaundar
 
Term 2 other handouts and notes
Term 2 other handouts and notesTerm 2 other handouts and notes
Term 2 other handouts and notesGhaundar
 
G7 Term 2 other handouts and notes
G7 Term 2 other handouts and notesG7 Term 2 other handouts and notes
G7 Term 2 other handouts and notesGhaundar
 
Term 2 other handouts and notes
Term 2 other handouts and notesTerm 2 other handouts and notes
Term 2 other handouts and notesGhaundar
 
G7 Term 2 other handouts and notes
G7 Term 2 other handouts and notesG7 Term 2 other handouts and notes
G7 Term 2 other handouts and notesGhaundar
 
Guide to creating an e portfolio
Guide to creating an e portfolioGuide to creating an e portfolio
Guide to creating an e portfolioSakhileMndzebele
 
1st lecture basics of visio
1st lecture  basics of visio1st lecture  basics of visio
1st lecture basics of visioZahida Pervaiz
 
Powerpoint instructions
Powerpoint instructionsPowerpoint instructions
Powerpoint instructionsDerek D'Angelo
 
Getting coding in under a hour with Imagine Microsoft
Getting coding in under a hour with Imagine MicrosoftGetting coding in under a hour with Imagine Microsoft
Getting coding in under a hour with Imagine MicrosoftLee Stott
 
Getting Started on Glogster: A Task Analysis for Teachers and Students
Getting Started on Glogster: A Task Analysis for Teachers and StudentsGetting Started on Glogster: A Task Analysis for Teachers and Students
Getting Started on Glogster: A Task Analysis for Teachers and StudentsShayna Quinn
 
Photoshop starter elephant compressed
Photoshop starter elephant compressedPhotoshop starter elephant compressed
Photoshop starter elephant compressedDB3igs
 
1 DIGITAL DOCUMENTATION.pdf
1 DIGITAL DOCUMENTATION.pdf1 DIGITAL DOCUMENTATION.pdf
1 DIGITAL DOCUMENTATION.pdfJNVKGLCS
 
Ppt exercise
Ppt exercisePpt exercise
Ppt exercisekaz naqvi
 

Similar to Digital portfolio 2 navigation, html, blog, logo (20)

publisher.ppt
publisher.pptpublisher.ppt
publisher.ppt
 
G8 Term 2 other handouts and notes
G8 Term 2 other handouts and notesG8 Term 2 other handouts and notes
G8 Term 2 other handouts and notes
 
Term 2 other handouts and notes
Term 2 other handouts and notesTerm 2 other handouts and notes
Term 2 other handouts and notes
 
G7 Term 2 other handouts and notes
G7 Term 2 other handouts and notesG7 Term 2 other handouts and notes
G7 Term 2 other handouts and notes
 
Term 2 other handouts and notes
Term 2 other handouts and notesTerm 2 other handouts and notes
Term 2 other handouts and notes
 
G7 Term 2 other handouts and notes
G7 Term 2 other handouts and notesG7 Term 2 other handouts and notes
G7 Term 2 other handouts and notes
 
Guide to creating an e portfolio
Guide to creating an e portfolioGuide to creating an e portfolio
Guide to creating an e portfolio
 
Problem solving
Problem solvingProblem solving
Problem solving
 
Computer Science.pptx
Computer Science.pptxComputer Science.pptx
Computer Science.pptx
 
1st lecture basics of visio
1st lecture  basics of visio1st lecture  basics of visio
1st lecture basics of visio
 
Presentation2.0.pdf
Presentation2.0.pdfPresentation2.0.pdf
Presentation2.0.pdf
 
Powerpoint instructions
Powerpoint instructionsPowerpoint instructions
Powerpoint instructions
 
Creating a web page
Creating a web pageCreating a web page
Creating a web page
 
Power Point presentation workshop, 2018
Power Point presentation workshop, 2018Power Point presentation workshop, 2018
Power Point presentation workshop, 2018
 
Getting coding in under a hour with Imagine Microsoft
Getting coding in under a hour with Imagine MicrosoftGetting coding in under a hour with Imagine Microsoft
Getting coding in under a hour with Imagine Microsoft
 
Getting Started on Glogster: A Task Analysis for Teachers and Students
Getting Started on Glogster: A Task Analysis for Teachers and StudentsGetting Started on Glogster: A Task Analysis for Teachers and Students
Getting Started on Glogster: A Task Analysis for Teachers and Students
 
Photoshop starter elephant compressed
Photoshop starter elephant compressedPhotoshop starter elephant compressed
Photoshop starter elephant compressed
 
LiveBinders Tutorial
LiveBinders TutorialLiveBinders Tutorial
LiveBinders Tutorial
 
1 DIGITAL DOCUMENTATION.pdf
1 DIGITAL DOCUMENTATION.pdf1 DIGITAL DOCUMENTATION.pdf
1 DIGITAL DOCUMENTATION.pdf
 
Ppt exercise
Ppt exercisePpt exercise
Ppt exercise
 

More from Sung Woo Yoo

Wk. 1 News and Newsworthiness
Wk. 1 News and NewsworthinessWk. 1 News and Newsworthiness
Wk. 1 News and NewsworthinessSung Woo Yoo
 
11 2-15 twitter and social media
11 2-15 twitter and social media11 2-15 twitter and social media
11 2-15 twitter and social mediaSung Woo Yoo
 
Digital portfolio 1 overview and examples
Digital portfolio 1  overview and examplesDigital portfolio 1  overview and examples
Digital portfolio 1 overview and examplesSung Woo Yoo
 
09 22-16-audio slideshow assignments
09 22-16-audio slideshow assignments09 22-16-audio slideshow assignments
09 22-16-audio slideshow assignmentsSung Woo Yoo
 
09 13-15 photo and image, what to shoot
09 13-15 photo and image, what to shoot09 13-15 photo and image, what to shoot
09 13-15 photo and image, what to shootSung Woo Yoo
 
09 13-16 image and photo, how and what to shoot
09 13-16 image and photo, how and what to shoot09 13-16 image and photo, how and what to shoot
09 13-16 image and photo, how and what to shootSung Woo Yoo
 
09 13-15 photo and image, what to shoot
09 13-15 photo and image, what to shoot09 13-15 photo and image, what to shoot
09 13-15 photo and image, what to shootSung Woo Yoo
 
09 08-16 lecture witness journalism
09 08-16 lecture witness journalism09 08-16 lecture witness journalism
09 08-16 lecture witness journalismSung Woo Yoo
 
02 25-16lecturephotocomposition-160225155509
02 25-16lecturephotocomposition-16022515550902 25-16lecturephotocomposition-160225155509
02 25-16lecturephotocomposition-160225155509Sung Woo Yoo
 
Lecture, Curation Journalism
Lecture, Curation JournalismLecture, Curation Journalism
Lecture, Curation JournalismSung Woo Yoo
 
What is news? Elements of Newsworthiness
What is news? Elements of NewsworthinessWhat is news? Elements of Newsworthiness
What is news? Elements of NewsworthinessSung Woo Yoo
 
09 05-16 storytelling basics
09 05-16 storytelling basics09 05-16 storytelling basics
09 05-16 storytelling basicsSung Woo Yoo
 
Twitter presentation
Twitter presentationTwitter presentation
Twitter presentationSung Woo Yoo
 
Digital portfolio 1 overview and examples
Digital portfolio 1  overview and examplesDigital portfolio 1  overview and examples
Digital portfolio 1 overview and examplesSung Woo Yoo
 
Digital portfolio overview with examples
Digital portfolio overview with examplesDigital portfolio overview with examples
Digital portfolio overview with examplesSung Woo Yoo
 
04 05-16 social media and news
04 05-16 social media and news04 05-16 social media and news
04 05-16 social media and newsSung Woo Yoo
 
02 23-16 audio slideshow assignments
02 23-16 audio slideshow assignments02 23-16 audio slideshow assignments
02 23-16 audio slideshow assignmentsSung Woo Yoo
 
What to do after you have story idea
What to do after you have story ideaWhat to do after you have story idea
What to do after you have story ideaSung Woo Yoo
 

More from Sung Woo Yoo (20)

Wk. 1 News and Newsworthiness
Wk. 1 News and NewsworthinessWk. 1 News and Newsworthiness
Wk. 1 News and Newsworthiness
 
11 2-15 twitter and social media
11 2-15 twitter and social media11 2-15 twitter and social media
11 2-15 twitter and social media
 
Digital portfolio 1 overview and examples
Digital portfolio 1  overview and examplesDigital portfolio 1  overview and examples
Digital portfolio 1 overview and examples
 
09 22-16-audio slideshow assignments
09 22-16-audio slideshow assignments09 22-16-audio slideshow assignments
09 22-16-audio slideshow assignments
 
09 13-15 photo and image, what to shoot
09 13-15 photo and image, what to shoot09 13-15 photo and image, what to shoot
09 13-15 photo and image, what to shoot
 
09 13-16 image and photo, how and what to shoot
09 13-16 image and photo, how and what to shoot09 13-16 image and photo, how and what to shoot
09 13-16 image and photo, how and what to shoot
 
09 13-15 photo and image, what to shoot
09 13-15 photo and image, what to shoot09 13-15 photo and image, what to shoot
09 13-15 photo and image, what to shoot
 
09 08-16 lecture witness journalism
09 08-16 lecture witness journalism09 08-16 lecture witness journalism
09 08-16 lecture witness journalism
 
02 25-16lecturephotocomposition-160225155509
02 25-16lecturephotocomposition-16022515550902 25-16lecturephotocomposition-160225155509
02 25-16lecturephotocomposition-160225155509
 
Lecture, Curation Journalism
Lecture, Curation JournalismLecture, Curation Journalism
Lecture, Curation Journalism
 
What is news? Elements of Newsworthiness
What is news? Elements of NewsworthinessWhat is news? Elements of Newsworthiness
What is news? Elements of Newsworthiness
 
09 05-16 storytelling basics
09 05-16 storytelling basics09 05-16 storytelling basics
09 05-16 storytelling basics
 
Twitter presentation
Twitter presentationTwitter presentation
Twitter presentation
 
Digital portfolio 1 overview and examples
Digital portfolio 1  overview and examplesDigital portfolio 1  overview and examples
Digital portfolio 1 overview and examples
 
Digital portfolio overview with examples
Digital portfolio overview with examplesDigital portfolio overview with examples
Digital portfolio overview with examples
 
Snapchat (1)
Snapchat (1)Snapchat (1)
Snapchat (1)
 
News & periscope
News & periscopeNews & periscope
News & periscope
 
04 05-16 social media and news
04 05-16 social media and news04 05-16 social media and news
04 05-16 social media and news
 
02 23-16 audio slideshow assignments
02 23-16 audio slideshow assignments02 23-16 audio slideshow assignments
02 23-16 audio slideshow assignments
 
What to do after you have story idea
What to do after you have story ideaWhat to do after you have story idea
What to do after you have story idea
 

Recently uploaded

This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.christianmathematics
 
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Pooja Bhuva
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17Celine George
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...Nguyen Thanh Tu Collection
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...Nguyen Thanh Tu Collection
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...ZurliaSoop
 
latest AZ-104 Exam Questions and Answers
latest AZ-104 Exam Questions and Answerslatest AZ-104 Exam Questions and Answers
latest AZ-104 Exam Questions and Answersdalebeck957
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsMebane Rash
 
OSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsOSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsSandeep D Chaudhary
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibitjbellavia9
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxCeline George
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentationcamerronhm
 
Tatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf artsTatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf artsNbelano25
 
Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsKarakKing
 
Interdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxInterdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxPooja Bhuva
 
Plant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptxPlant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptxUmeshTimilsina1
 
How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSCeline George
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxJisc
 
21st_Century_Skills_Framework_Final_Presentation_2.pptx
21st_Century_Skills_Framework_Final_Presentation_2.pptx21st_Century_Skills_Framework_Final_Presentation_2.pptx
21st_Century_Skills_Framework_Final_Presentation_2.pptxJoelynRubio1
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...Amil baba
 

Recently uploaded (20)

This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
 
latest AZ-104 Exam Questions and Answers
latest AZ-104 Exam Questions and Answerslatest AZ-104 Exam Questions and Answers
latest AZ-104 Exam Questions and Answers
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan Fellows
 
OSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsOSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & Systems
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptx
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentation
 
Tatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf artsTatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf arts
 
Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functions
 
Interdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxInterdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptx
 
Plant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptxPlant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptx
 
How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POS
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
21st_Century_Skills_Framework_Final_Presentation_2.pptx
21st_Century_Skills_Framework_Final_Presentation_2.pptx21st_Century_Skills_Framework_Final_Presentation_2.pptx
21st_Century_Skills_Framework_Final_Presentation_2.pptx
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
 

Digital portfolio 2 navigation, html, blog, logo

  • 1. Participatory news “Then we [you, the reader, and I, the author] come together to make this book, to feel this experience.” “Writing and reading are not that distinct for the writer..” -Conversations with Toni Morrison For news curation, one of many ways to success is to personalize the news and include reactions that would entail more reactions.
  • 2. • We will finish MUSE exercise today. By next Tuesday, create tumblr account. • Send the links to me via email. • Tutorial video. <Create tumblr and embed into Muse> https://www.youtube.com/watch?v=gXV5Zapn8cE
  • 3. Examples of draft layout in drawing. • http://www.radiatedigital.com/the-web-design-process-from-first- concept-to-final-draft/ • http://www.yourinspirationweb.com/en/how-to-present-the-draft- to-the-client-tips-and-examples/ • http://www.wikihow.com/Create-Your-First-Website
  • 4. Continue with Muse: Working with Text • Import and place text. Your bio, for example. 1. Let’s give it a title. New color, size. 2. Change track and leading of the body. 3. Select font. Standard font Select from Type kits: New set, Cubano sharp and so on. Select from Edge font Explore Self hosted font.
  • 5. Set a style so that you don’t have to do the work over and again. • Use paragraph style Set up a heading style Set up a body style.
  • 6. Adding Navigation • Go to widget library. Names are synchronized • Get subpage by clicking All page. Adjust other options • Change text, color of menu boxes. (Select a box. Make sure edit together is checked. Go to Fill at the top and select a color) • Try menu with texts only. (Go to Fill at the top and select no color) • Change the states. Window>states, make sure you have edit together checked. -Normal -Rollover -Mouse down *Study other websites and learn them.
  • 7. Add navigation (menu) in three formats. 1. Navigation with texts only. Select a box. Make sure edit together is checked. Go to Fill at the top and select no color. Adjust the font and color of your page names. 2. Navigation with boxes. Select a box. Make sure edit together is checked. Go to Fill at the top and select a color. Adjust the font and color of your page names. 3. Navigation with other shapes. Create a shape first. And then add navigation with no color.
  • 8. Inserting HTML • Insert Youtube. • Storify • Google map
  • 9. Inserting shapes A.Setting and deleting guides. B.Adding background image. •-browser fill •-add image •-Scale to fill •-Position •-Scroll checked
  • 10. Other changes Rectangle: Drag. Round up. Other shapes should be created outside. •*Corner radius Color •-Fill: Solid/Gradient, Opacity, Color, Add image •Gradient: Two colors, Focal point, direction, Size •-Stroke: weight, center, outside, inside Stacking objects •-select and right click, arrange, send backward/bring to front •-In panel use layers. Aligning objects. Add effects.
  • 11. Format contact page. • Use widget library • Drag simple forms and place • For additional change on the page, watch tutorial. • https://helpx.adobe.com/muse/how-to/muse-create-simple- form.html
  • 12. Slideshow using widgets • Open widget library> slideshow • Click, drag and drop thumbnail. • Click blue arrow • Add image • Adjust the size of thumbnail • Unclick counter, previous and next. • Adjust captions • Select text and type in text • Test in preview mode.
  • 13. Link to your document (resume) • Use Hyperlink to the online material or other pages. -Select the texts. -On the upper right corner select hyperlink. -type in URL. • Or embed the PDF document itself to the webpage. -You can use online PDF embedder. -Scribd.com -Get the embed code. -Drag and place it on the webpage.
  • 14. You can also upload files directly to MUSE • 1. Add this PDF file to assets folder of Muse from File > Add file for Upload. • 2. Muse will take you to the windows explorer or finder and you need to find the PDF file and select it. • 3. Once the file is selected you will be able to see it in Assets panel. You can enable assets panel from Windows > Assets • 4. Now create a rectangle or text box on which you want the visitor to click. • 5. Select that rectangle or text box and open hyperlink tab and select the file below the file section of the dropdown. • 6. Upload the entire website to your host. • 7. Test it.
  • 15. Different types of resume page. • 1. Typing and linking • http://www.lamivo.com/resume.html • 2. Screen capture and download • http://www.megangtalley.com/resume.html • 3. Make it into subpages • http://mattwyatt.org/cv/professional-experience/ • 4. Designed interactive page • http://maceykateherges.wix.com/maceykateherges#!resume/c16wr
  • 16. Get other things you want in the front page or all the pages. • Twitter feed. • Social media buttons -try using widgets. -try using Photoshop. You can draw them yourself. Or, You can use free websites for icons. https://colorlib.com/wp/free-flat-social-media-icons-sets/ Or http://www.dreamstale.com/free-download-72-vector-social-media- icons/
  • 17. Logo with photoshop • Basic logo with texts. “Simple logo” http://www.genesisclub.training/1682/how-to-make-a-text-logo-in- photoshop/
  • 18. Other simple versions with photoshop http://webriti.com/how-to-make-simple-logos-using-adobe- photoshop-cs3/ http://www.makeuseof.com/tag/how-to-create-a-simple-blog-logo-in- photoshop/
  • 20. 30 examples of logo tutorials • http://designscrazed.org/photoshop-logo-design-tutorials/ • Step by step. Step 1 • Open a new Photoshop file that is 8 by 10 wide with high image resolution settings (300 dpi or higher). Although you will rarely use a logo this size, quality is retained when shrinking. You can not enlarge small files without losing quality. Step 2 • Select the Text Tool from the left palette designated with a "T" in the box. Center the cursor and type in the company name. Adjust the fonts through the font palette that appears in the upper right corner with the Text Tool to play with font types, sizes and colors until you are happy with the way the company name looks. Step 3 • Create a new layer by selecting "New Layer" from the drop-down menu along the top of the program. You will want to create a new layer for each step; this gives you the ability to move or change certain elements while keeping others. Keep track of layers in the box on the lower right side of the screen--the bold item is the layer you are working on with any item that has an "eye" icon next to it is seen on the screen.
  • 21. Step 4 • Type a title for your logo in the new layer using the Text Tool once again. Use the font palette to change the font, length and height--for example, stretching the title. Step 5 • Import any graphic designs or pictures you have royalty free rights to and want to use in the logo. You can find images from stock footage libraries or clip art files. If you have no artwork yet, you can "draw" it into a new layer using any of the following tools: Pencil, Shape or Paintbrush.
  • 22. Step 6 • Move elements from each layer around on the logo by clicking on the layer menu on the lower right and selecting the layer you want to work on. You can link layers by clicking on the box under the chain link icon or only view the layer you are working on by clicking on the eye icon to remove it from view. Step 7 • Add effects, such as bevels, shadows, or color gradients. Use the Effects tab on the drop-down menu at the top of the screen to choose the effects you want to try. A preview will be given before the change is made permanently. Step 8 • Save your file as a *.psd and a*.jpg . The *.psd is your original Photoshop file with all layers; keep this so you can make changes at a later point if you want to. The *.jpg is a combined file with all element layers combined into one making it a smaller file easier to email to print shops.