Digication eportfolio Student s Guide (Last update: 8/2017)

Digication eportfolio Student s Guide (Last update: 8/2017) 2

Table of Contents Introduction... 1 Creating Your eportfolio... 3 Editing Your eportfolio... 4 Area 1: Top Menu Bar... 6 Area 2: The Main Tabs... 7 Portfolio Tools... 7 Area 3: The Content Editing Area... 9 Sections... 9 Pages... 11 Area 4: The Commenting Area... 14 View Comments... 14 Settings... 14 Manage Comments... 15 Adding Content to eportfolio Pages... 16 eportfolio Settings... 39 3

Introduction Welcome to the Digication eportfolio Student s Guide. The purpose of this guide is to familiarize you with the tools that are available in Digication for building your eportfolio. If you have any questions about Digication, or about eportfolios in general, you can send an email to: uvadigication-suppport@virginia.edu. The following support services are also available for you: eportfolio Peer Consultants (eppc): This is a group of students who are trained on Digication and eportfolio constructions, and are ready to help their peers through one-on-one consultations. You can write to them at: eppc@collab.virginia.edu or visit their website at: https://collab.itc.virginia.edu/x/0gproa, or their Facebook page at: https://www.facebook.com/uvaeppc/timeline eportfolio FAQ: Here is a link to frequently asked questions about Digication s use and application: https://collab.itc.virginia.edu/x/p5f1xr eportfolios at UVa: This website is devoted to discussions on topics related to eportfolios. You can subscribe to it to get updates as well as to participate in its discussion forum. 4

Creating Your eportfolio Figure 1 Go to your UVaCollab site and click on the eportfolio button in the menu bar. Digication should automatically open a Welcome to Digication splash screen in a new tab in your browser. (If you cannot see it, check the tabs at the top of your browser.) Figure 2 The Welcome to Digication screen will be where yours and your classmates eportfolios will be listed. To create your eportfolio click on the green plus sign on the Digication Welcome Page. Depending on the options set up by your instructor, you will see something like the following dialog box: 5

Figure 3 The top box is the field for your eportfolio title. By default, Digication will fill it out with "<your name>'s eportfolio #-1". You can accept the default or change it. Below that (depending on your instructor's decision) there will be a large green rectangle that will allow you to create your eportfolio from scratch. That means there will be no preset sections and pages in the eportfolio you create. Further down (again, depending on your instructor's decision) there will be one or more templates to choose from. Templates come with pre- defined sections and pages. After you fill out your eportfolio s title (or accept the default), as soon as you click on whichever of the two options you choose ( from scratch or from template ), Digication will automatically create your eportfolio and take you back to the Welcome to Digication screen. Your eportfolio will be listed next to the green plus sign. Figure 4 6

Editing Your eportfolio Go to your UVaCollab site and click on the eportfolio button in the menu bar. Digication should automatically open a Welcome to Digication splash screen in a new tab in your browser. (If you cannot see it, check the tabs at the top of your browser.) Figure 5 Click on the link to your eportfolio. (It should be listed to the right of the green plus sign you clicked on to start the creation process.) This will take you to the Digication eportfolio editing screen. 7

eportfolio Editing Screen The eportfolio editing screen can be divided into four sections: the top menu bar, the main tabs, the content editing area, and the commenting area. Figure 6 8

Area 1: Top Menu Bar Figure 17 The menu bar at the top of the screen consists of the following buttons: Home: Allows you to navigate back from anywhere to this page, your homepage. Calendar: Allows you to keep track of up-coming events, as well as to-do lists. People: Allows you to see all other registered users in Digication. Course: Allows you access any courses you have been added to or, courses you have chosen to join. eportfolios: Allows you to search for and see publicly viewable videos as well as videos that have been set to be visible to registered (i.e., UVa) users of Digication. Subscription: Allows you to keep track of eportfolios and courses that interest you by subscribing to them. [your name]: The button listing your name allows you to access your account information (name, password, etc.) and profile which you can edit as needed. Logout: Logs you out and takes you to the Digication login page. More: Provides information for those who have Digication accounts at other institutions. Help: Provides detailed support for Digication features. 9

Area 2: The Main Tabs Below the menu bar are the Main Tabs for working with your eportfolio. Figure 8 Edit Tab: Is selected by default when you first open the page. It is the tab that allows you to edit your eportfolio. Preview Tab: Allows you to preview all of the pages you have saved (not published) while creating your eportfolio. Published Tab: Allows you to see all of the pages you have published, meaning pages you have made visible to your audience through Settings. (Settings are determined by default when you first create an eportfolio, but can be changed.) Portfolio Tools This tab allows you to work on your eportfolio as a whole. It has six sub-items in a drop-down list: o Settings: Allows you to go back and edit the settings for the eportfolio you are working on. o Submit: Allows you to pick a page from your eportfolio, or pick your whole eportfolio to submit to an assignment. (You have to be in a course with assignments.) o Download: Allows you to make a zip file of your eportfolio to take away from Digication. o Make a Copy: Allows you to duplicate an eportfolio you have created instead of starting from scratch to create a new one. o Organize: Lets you easily move and reorganize pages and sections of your eportfolio. o Delete: Lets you remove an eportfolio you no longer want. 1

Figure 9 Sitemap: The last item in this area (bottom right) is the Site Map button which allows you to see the pages you have created in a hierarchical list format. Once you have created a lot of pages, it is a useful way to find and edit a particular page. Figure 10 These are the tools in the menu area. Their use will be clearer to you once you start working on your eportfolios. 1

Area 3: The Content Editing Area Below the Digication menu bar and the main tabs is the actual eportfolio editing area. This area can be divided into three tool areas: tools for creating sections, tools for creating pages, and tools for working with modules. Sections The top part of this area is for creating the Sections of your eportfolio. Your sections will appear as links in a horizontal row at the top of your eportfolio pages. This area has two tabs: for Viewing and for Adding/editing your sections. o View: The section opens in View mode by default and the first section, Home, which has been created for you is automatically, is selected. Figure 11 o Add/Edit: In the far right, you will see Add/Edit section button. Click on the Add Section button. Figure 12 1

Type in the name of the new section, -- Projects, for example -- and click on the Save button to save it. Figure 13 Your new section should appear next to the Home section. You will notice, as the instruction points out, that sections can be edited by clicking on the icon next to the section name. You can change the name of the section and save it, or delete it altogether. Figure 14 You can also click on the Show Advanced link to do things like change the address of the section as well as hide or show it. Click on the Hide Advanced link again to close it. Figure 15 11

Pages Below the sections area is the area for constructing the pages of your eportfolio. The pages are where you place the content of your work such as text, images, video, and links to other parts of your work or other pages on the Web. Like the Section area, Pages also has two tabs, for viewing and for adding/editing pages. o View: The page area opens in View mode by default and the first page, Welcome (under the Home section) has been created for you automatically and is selected. Figure 16 o Add/Edit: Click on the Add/Edit tab to open the page editor. Click on the Add Page button to add a new page. Figure 17 10

Type in the name of the new page, -- Contact, for example -- and click on the Save button to save it. Figure 18 Your new page should appear below the Welcome page. You will notice, as the instruction points out, page names can be edited by clicking on the icon next to the name of the page. Figure 19 12

You can also click on the Show Advanced link to do things like change the address of the page, hide or show the page, make it collapsible, or make it non-clickable so it serves as a heading for a series of sub-pages. Click on the Hide Advanced link again to close it. Figure 20 13

Area 4: The Commenting Area The Commenting area is towards the bottom of your editing screen. It has three tabs: View Comments This tab will be open by default. Below it are two columns. The left hand side is for entering comments and tags. The right hand side is for viewing any comments and tags that have been entered for this page. Figure 21 Settings This tab allows you to control how comments are set up for your eportfolio. It is a mini version of what is found in the Settings page. Figure 22 14

Manage Comments This tab allows you to Approve comments that have been submitted to your page (if they require approval) and to Delete comments you wish to remove. Figure 23 15

Adding Content to eportfolio Pages In Digication, the basic building block for structuring a page is the Module. Modules define what kind of content can be added and its layout within the page. You can add multiple modules to a page to gain flexibility in how you customize the presentation of your work. The modules will appear seamlessly in a vertical fashion, but can be rearranged by dragging and dropping. Select a Module: In the far right side of the Pages area you will notice the Add a Module button which you can click to open and close the list of modules. Digication provides three groups of modules: Basic, Google, and Social: o Basic: The Basic group is the most commonly used group and has five types of modules: Image/Video/Audio: This module allows you to place a single media file (image, video, audio, or pdf) as a single module on your page. It is also useful for upload large video files. Figure 24 16

Rich Text: This module allows you to place a block of text (with links, and embedded images, video, graphics, or pdfs) on your page. Figure 25 Gallery: This module allows you to select multiple media items (images, videos, audio files, or pdfs) and present them with clickable thumbnails for navigating between them. Figure 26 17

Contact Form: This module is a ready-made form which you can include in your eportfolio so that viewers can get in touch with you by email. Figure 27 Equation: This module can be used to enter mathematical formulae converted into their appropriate symbols. Figure 28 18

o Google: The Google modules allow you to embed your Google applications (documents, spreadsheets, presentations, forms, and calendars) into your eportfolio. The embedding allows viewers to interact with your Google applications through your eportfolio. Figure 29 o Social: The Social group of modules allow you to embed your social applications (Twitter and Bookmarks) into your eportfolio. The embedding allows viewers to interact with your social applications through your eportfolio. Figure 30 19

Add this Module: Once you have selected a module to add to your page, you can click on the Add this Module button at the bottom right area of the page. The module you chose will open. Figure 31 At the top of the page, you will see two Buttons: Add a Module and Publish this Module. And below them you will see a set of tabs specific to each module: o Image/Video/Audio: View Media: For previewing your work as you create it (i.e. before saving or publishing it). Figure 32 20

Edit: For making changes to your work in edit mode. This module opens in Edit mode by default and provides two options: Replace this Media with Large Video (Beta): As the label suggests, this option is still under development (beta), but you can use it to upload large media files (above 10 Megabytes). Large files will take longer to upload. Replace this Media: Clicking this button will allow you to upload another media file. Figure 33 Settings: For changing the settings associated with the module: I want others to be able to download this: Checking this checkbox allows your viewers to download the image, video, or audio file you have uploaded. Figure 34 Publish: This tab makes your work visible to your viewers. (Notice the red bar which appears to let you know the module you are working on has not been published. This is to remind you that modules that 21

have not been published will not be visible to your viewers.) Figure 35 Delete: For removing your work. Figure 36 22

Drag to Reorder: For rearranging this module in relation to other modules you may have on the page. Figure 37 o Rich Text: View Text: For previewing your work as you create it (i.e. before saving or publishing it). Figure 38 23

Edit: For making changes to your work in edit mode. Figure 39 Publish: This tab makes your work visible to your viewers. (Note: Below the six tabs is a red bar which appears to let you know the module you are working on has not been published. This is to remind you that modules that have not been published will not be visible to your viewers.) Figure 40 24

Delete: For removing your work. Figure 41 Drag to Reorder: For rearranging this module in relation to other modules you may have on the page. Figure 42 o Gallery: 25

View Gallery: For previewing your work as you create it (i.e. before saving or publishing it). Figure 43 Edit: For making changes to your work in edit mode. Figure 44 26

Publish: This tab makes your work visible to your viewers. (Note: Below the six tabs is a red bar which appears to let you know the module you are working on has not been published. This is to remind you that modules that have not been published will not be visible to your viewers.) Figure 45 Delete: For removing your work. Figure 46 27

Drag to Reorder: For rearranging this module in relation to other modules you may have on the page. Figure 47 28

o Contact Form: View Contact Form: For previewing your work as you create it (i.e. before saving or publishing it). Figure 48 Settings: For changing the settings associated with the module. Email: for entering your email address. Figure 49 29

Delete: For removing your work. Figure 50 Drag to Reorder: For rearranging this module in relation to other modules you may have on the page. Figure 51 30

o Equation: View: For previewing your work as you create it (i.e. before saving or publishing it). Figure 52 Edit: For making changes to your work in edit mode. Figure 53 31

Publish: This tab makes your work visible to your viewers. (Note: Below the six tabs is a red bar which appears to let you know the module you are working on has not been published. This is to remind you that modules that have not been published will not be visible to your viewers.) Figure 54 Delete: For removing your work. Figure 55 32

Drag to Reorder: For rearranging this module in relation to other modules you may have on the page. Figure 56 Three Basic Modules: The three most commonly used modules are: the rich text module, the gallery module, and the contact form module. o Rich Text Module: The Rich Text module is an online editor with a typical editor menu bar. You can hover the cursor on any icon in the menu-bar to read its tooltip. 33

Entering Text: You can enter text in the Rich Text module in two ways: typing directly in the text area, and cutting-and-pasting from another application like Microsoft Word. Figure 57 Inserting Files Icon: You can insert links to uploaded files using the Insert File icon in the menu-bar. Users can then click on the link you create to open the file you have uploaded. Figure 58 34

Figure 59 Insert/Edit Link Icon: This is another tool that lets you create links to files. However, it is designed for items that are online already and will not let you upload files from your computer. Figure 60 35

36

Insert Media Icon: You can embed media files using the Insert Media icon in the menu-bar. Users will be able to see on your page the media file (image, video, pdf, etc.) that you have either uploaded or linked to online. Inserting media in this way allows you to mix text with audio, video, images, and open pdf files. You are also able to resize the media file as well as wrap text around it. Figure 61 Figure 62 37

o Gallery: The Gallery tool allows you to upload multiple media files which can be shown in a gallery format with thumbnails or arrows for a vertical or horizontal arrangement of navigation. The Gallery tool also allows for captions to be placed above or below the image. Figure 63 o Contact Form: The Contact Form allows you to collect email from viewers of your site without having to give out your email address. You will need to provide the email address you want Digication to use. Figure 64 38

eportfolio Settings When you first create an eportfolio, Digication provides default settings that control the way your eportfolio works. However, you can change these settings at any time. This section discusses the default settings as well as how you can change them. Go to your UVaCollab site and click on the eportfolio button in the menu bar. Digication should automatically open a Welcome to Digication splash screen in a new tab in your browser. (If you cannot see it check the tabs at the top of your browser.) Figure 65 There click on the link to your eportfolio. (It should be listed in the top right corner of the screen next to the green plus sign you clicked on to start the creation button.) This will take you to the Digication eportfolio editing screen. To go to the Settings screen, click on the Portfolio Tools tab in the top right area of your screen. Then, in the drop-down menu, select the Settings option. You will see the following options: Tile of Your eportfolio: This field contains the name of your eportfolio. You can change it to anything you want. Figure 66 39

eportfolio Web Address: The default web address is listed here. To change it, to change it, click on the Edit link next to it. Figure 67 Choose a Theme: o Customize: You can change the look-and-feel of your site by clicking on this button. More Themes: Clicking here will show you additional themes, if there are any. Figure 68 o Customize Theme: Directory Icon: This is the icon that shows up in the Digication directory. You can change it by clicking on the Choose button and selecting an image from your computer. 40

Upload New Image: This allows you to select an image to represent this eportfolio in the course list as well as the directory. Click the Choose File button to upload an image from your computer. Figure 69 Header Image: This image will appear on the top of every page of your eportfolio. To change the image, click on the radio button next to Upload New Image and then click on the Choose File button to select an image from your computer. Figure 70 41

Page Background: Background Color: This option allows you to set the background color of your page. Figure 71 Background Image: This option allows you to set the background image of your page. To change the image, click on the Choose File button and select an image from your computer. Background Image Repeat: This option lets you determine how the background image is set. Background Image Position: This option lets you determine how the background image is set. Preview: This button lets you see what your page will look like after you save the settings. Figure 72 42

Custom CSS: This option lets you modify the look-and-feel of your page by changing the Cascading Style Sheet (CSS). You need to understand CSS coding to use this page. Figure 73 Footer: This option allows you to set the text that appears at the bottom of your eportfolio screen. Figure 74 Permissions: o Private to Me: Only viewable by you Figure 75 o Private within the University of Virginia: Only viewable by users at University of Virginia 43

Show in Private School Directory: This option allows you to determine whether or not your eportfolio will appear in the directory. Require Password for Access: This option will allow you to protect your eportfolio with a password. If you choose to use a password, you will need to provide it in the field below this option. Figure 76 o Public: Viewable by anyone and searchable by google and other search engines. Show in Private School Directory: This option allows you to determine whether or not your eportfolio will appear in the directory. Require Password for Access: This option will allow you to protect your eportfolio with a password. If you choose to use a password, you will need to provide it in the field below this option. Figure 77 44

Custom Permissions: These are additional permission that let you decide who you share your eportfolio with (individuals, groups, or courses): o Search for User, Group, or Course: You can type here the name of the individual, group, or course with whom you want share your eportfolio. User: Enter the user s name. Group: Enter the group name. Courses: Enter the name of the course to find: Sharing with Students: This options allows you to share your work the all of the students in the course. Sharing with Faculty: This option allows you to share your work with your instructor and any other faculty in the course. Figure 78 o Role: Once you have selected the person, group, or course you want to share with, you can determine the role you want to give them: Viewer: Can view your eportfolio. Editor: Can edit your eportfolio, but not publish it. Publisher: Can edit and publish your eportfolio. Admin: Can edit eportfolio settings, including adding and removing users who edit and publish your eportfolio. 45

o Remove: You can also remove any person, group, or course with whom you are sharing your eportfolio. Figure 79 Tagging: Tags are labels that can be associated with your eportfolio to help it be found easily in the directory. o Do not allow tags: To disallow tagging. o Allow Tags by All Editors: Allow tagging by anyone who can edit your eportfolio (you and anyone you have allowed that right). o Allow tags by Anyone: Anyone viewing your work will be able to tag it. Figure 80 46

Comments: Settings for who can comment on each page of your work and how the comments, if they are allowed, would show. o Allow Comments from: No one Registered users Anyone o Show Comments: Show Comments Immediately. Do not show Comments until they have been approved. Do not show Comments to viewers. o Apply Comment Settings to Existing Pages of this eportfolio: Normally, if you change your Comments settings, the change would not apply to already existing pages. This checkbox allows you to make the change apply to all pages. Figure 81 47

Conversations: Settings for commenting on specific portions of text (works, sentences, paragraph, etc.) in your work. o Checkbox Once you have determined the settings, click on Create New eportfolio to go to the editing page and begin editing your eportfolio. You can always come back and change any of these settings. Figure 82 48