Building an ePortfolio using web 2.0 technologies
Matthew Mobbs
[email protected]
Building an ePortfolio using web 2.0 technologies
This guide is intended to introduce some of the web 2.0 tools that are available to assist in
developing an effective ePortfolio. ePortfolios are used as part of the PDP process in higher
education, PDP is a process of collection, reflection and progression of skills and academic ability.
ePortfolio - Wetpaint
The technology recommended to construct an ePortfolio is a wiki. After
extensive testing of several wiki environments the one that comes the most
highly recommended is Wetpaint (www.wetpaint.com), as it is selfexplanatory in editing abilities and versatile in terms of content.
Creating your ePortfolio
This can be set up in three steps from the front page of the Wetpaint site.
Step 1, this asks you to name your wiki, create a URL, state the purpose and select a category. For
this I would recommend:
Name
URL
What is your wiki about
Category
Who can view your
wiki?
Your Name ePortfolio
yourname.wetpaint.com (keep the URL lower case)
An ePortfolio for…
Education
Select your preferred option
The second part of Step 1 requires a decision on who has permission to edit the wiki. This can range
from everybody to invited members. As this is a personal repository, the most secure level is
recommended which is invited members. This is only for editing permissions, viewing rights are
available to all.
Step 2, ‘the fun bit’, allows you to select a
style for the ePortfolio, there is a wide
range to choose from. However, this can
always be changed at a later time if you are
unhappy with your original decision.
Step 3, the final step, requires you to create
a user account, if you don’t already have a
Wetpaint account. It requires you to create
a username, password and enter a contact email.
Once you have completed these steps you will be taken to your ePortfolio.
Designing an ePortfolio
Before extending the Wetpaint ePortfolio beyond the start-up stage it is important to consider the
content and how it will be structured. Here is an example structure for a student ePortfolio:
1
Building an ePortfolio using web 2.0 technologies
Matthew Mobbs
[email protected]
Home
Modules
Structure Explained
Home
Modules
Reflection
Career Planning
Student Experience
Computer Stuff
Fun Stuff
Reflection
Career
Planning
Student
Experience
Computer
Stuff
Fun Stuff
The main introduction and navigation page
The student can describe themselves at this point and hyperlink to relevant
pages
This section can be made up of several individual pages, one for each
module. This is where the student can record marks and tutor feedback.
Furthermore they can personally reflect on the module.
This area is used for more general reflection on their achievements, targeting
progress for the future.
This area can be used to plan their career path, highlighting activities
undertaken to assist along the way.
This area can also be used to maintain a CV
An area used to reflect upon extracurricular activities
This area can be used to ‘weave their web’. Bringing together online accounts
via RSS feeds.
Hobbies and other experiences
Adding Pages in Wetpaint
To start extending the Wetpaint ePortfolio pages can be added and edited. To add a page select the
‘Add Page’ link, located in the navigation box on the left-hand side of the page.
Add Page: Select the
link in the navigation
2
Building an ePortfolio using web 2.0 technologies
Matthew Mobbs
[email protected]
When the ‘Add Page’ link is selected a dialogue box (as seen here)
will appear. It requires a ‘Page name’ and it can be labelled with
‘Keyword tags’. The tags enable related content to be linked
together. Finally, a template can be chosen, for a standard text
page use the ‘Blank page’ option.
Adding Pages Tip: Wetpaint wikis can be sub-categorised into
sections. When adding a top level page into the wiki, as shown in the structure outlined in the
previous section, this has to be done from the ‘home page’. Adding a sub-category page, has to be
done from the top-level pages created, e.g. in the Modules section, a page can be created for each
Module, this is done from the Modules page, select ‘Add a Page’, and the appropriate page name
can be entered, usually the Module title.
Editing Pages in Wetpaint
To edit a new or existing page within a Wetpaint wiki, whilst on the page that
needs editing, select the icon seen here. This will only appear to registered
users of the wiki.
To edit a
page select
this icon
Once selected Wetpaint will go into editing mode, this presents the ‘EasyEdit
Toolbar’ seen below. This enables the page text to be entered and formatted.
The ‘EasyEdit’ uses ‘What You See Is What You Get (WYSIWYG)’, meaning the
editing and formatting that is produced in the editor, will be exactly how it appears in the live
version.
The formatting allows the font to be changed manually or selected from set styles. The ‘EasyEdit’
also allows tables and images to be added, although images have to be uploaded into the wiki
before they can be placed into pages.
The ‘EasyEdit’ mode can be used to insert hyperlinks into the pages. These can be links to external
websites or to other pages within the wiki. Once the wiki has grown to a substantive size, it is
recommended the ‘Suggest Link’ feature is used. This will match the words in the text to pages of
the same name within the wiki, creating links to the pages.
3
Building an ePortfolio using web 2.0 technologies
Matthew Mobbs
[email protected]
Tagging Wetpaint Pages
The tagging abilities within Wetpaint enable related pages to be linked together. Tags can be added
when a page is added to the wiki or anytime when viewing a page. To add a tag when viewing a
page the ‘Edit tags’ link is used, this is found in the shaded grey box at the bottom of the page, as
shown here.
When selected, the Edit Tags box will appear. Tags are added one
at a time however, a page can have as many tags attached to it as
required.
Once the tags have been added and saved, any pages that are
tagged with the same keyword will be listed in the ‘related
content’ list at the bottom of the page. The example seen here is
the modules section of a student’s ePortfolio. In the ePortfolio
each module has its own page, each tagged with the keyword ‘Marks’, therefore they all appear in
the Related Content section.
Inserting Widgets into Wetpaint pages
The ‘widgets’ in Wetpaint enables the embedding of web
content external to Wetpaint into the pages of your
ePortfolio. For example, the bookmarks from del.ico.us or
postings from a Twitter account outlined in the Web
Services and Account Guide.
To do this, view the page that the widget will be
embedded into and select the ‘EasyEdit’ button. In edit
4
Building an ePortfolio using web 2.0 technologies
Matthew Mobbs
[email protected]
view place the cursor at the position where you wish the widget to appear. From the ‘EasyEdit
Toolbar’ select the ‘Widgets’ button, this will open the ‘Add Widget’ Menu, there are a selection of
standard widgets. To embed your own content from a web service select RSS, the RSS URL of the
web service you wish to display then needs to be copied and pasted into the prompt box.
Then select ‘Add to page’, this will return you to the edit screen. If you do not wish to make any
further changes, select ‘Save’. Back in the live view, the widget will then say ‘Loading RSS Feed…’
and shortly after display your content. Here is an example of a del.ico.us and Twitter feed in a
Wetpaint Page.
Assessing Wetpaint ePortfolios
In an educational context it may be necessary for tutors to assess the ePortfolios of their students.
To do this it is recommended tutors subscribe to the RSS feed from the Wetpaint wiki. This will
inform the tutor of any changes made to any page within the ePortfolio.
This process make assessment more efficient, as the tutor will be informed of any changes, opposed
to having to regularly visit the site and identify changes.
Contact Me
Hope you found this guide helpful.
There are many other features Wetpaint that can be used in an ePortfoilio, if you have any questions
please visit our project site http://pleuol.wetpaint.com or contact me at [email protected]
5