1. ePortfolio Workshop
For the PSA Art Program
!
William Cromar, MFA
Lecturer, New Media in Art

2. ePortfolio Workshop
For the PSA Art Program
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...

3. Group class blog > Individual blog > Individual ePortfolio
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...
newMedia course blog
Student blog
Student webpage

4. Studio Art Making
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

5. Studio Art Making
Studio Art Making
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

6. Acquisition of specific skills or outcomes
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...

7. Achievement of specifically stated goals
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...

8. Showcase of highest level of achievement
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...

9. PSU Personal Space becomes a gateway to...
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...

10. ... a reciprocally linked externally hosted site...
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...
>
<

11. ... later evolving into your professional ePortfolio
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...

12. How to make an e-portfolio...
ePortfolios exhibit...
... Process and Product
... Proficiency
... Progress
... Professionalism
... Portability (Web 2.0)
ePortfolio how-to...
...Create your content cloud
...Set up website
...Embed content in form
...Create your network
...Create feedback loop

13. Studio Art Making
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

14. Studio Art Making
Your content cloud...
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

15. Your content cloud... decide on needed artifacts
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Documents?
G-Drive, Dropbox, etc.
Resume/CV
Artist statement
Teaching Philosophy
!
Features
Linkable
Downloadable
No to low cost
Videos?
YouTube,Vimeo, etc.
Video documentary
Video art (HD)
Slideware conversions
!
Features
Linkable, embeddable
Customizable embeds
Vimeo downloadable
Licensing control
No to low cost
Images?
Flickr, Picasa, etc.
Documentary images
Native digital images
Video clips (Flickr)
!
Features
Linkable, embeddable
Downloadable
Sets and collections
Licensing control
No to low cost
Slideshows, Publications?
SlideShare, Scribd, etc.
Slideshows
PDFs and eBooks
Text documents
!
Features
Linkable, embeddable
Downloadable
Licensing control
No to low cost

16. Studio Art Making
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

17. Studio Art Making
Your site… Webfiles (server) or CMS?
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

18. Your WebFiles... setting up a server-based web space
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Visit WEBFILES »
A server-based file management system
New Web 2.0 interface with drag and drop upload
Download and other buttons for file management
!
Visit PASS INFORMATION »
Find Change Quota menu: change to 10.0 GB
Incidentally: note other info available here...
!
Visit Penn State Personal Web Server »
Find Apply for Web space on www.personal.psu.edu »
You will be asked to take a quiz on proper use of site
Pass the quiz, and move on to the application
You will be emailed when the web account is created
Visit WEBFILES again »
Double-click on a new folder named [ www ] .
Observe a file named index.html .
!
In a new browser tab, visit www.personal.psu.edu/user1234 »
Observe a boilerplate homepage: this is index.html in WebFiles
WE MUST DESTROY and REPLACE THIS BOILERPLATE!

19. Your WebFiles... replacing the index.html file
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Wiki HTML file like TiddlyWiki »
A complete website in one HTML file.
Add content on desktop, upload to [ www ] as index.html .
Download to desktop to update, then re-up to PASS.
Shallow learning curve, no HTML knowledge required.
Limited customization, but advanced users can use CSS.
Useful as portal to link to external site, blog, etc.
TiddlyWiki is free to download and use.
HTML editor: Dreamweaver, KompoZer, etc »
Can create complete websites.
Build page(s) in folder on desktop, upload to [ www ] .
Keep local copy to edit and upload to PASS to update.
More of a learning curve, some HTML helpful.
High customization, but can also edit free templates from web.
Start with a link portal, add functionality as skills increase.
Dreamweaver available 343 Woodland, free 30 day trial.
KompoZer is free and open-source.
!
!
Afraid of code and file upload? There’s other ways…
!

20. Your CMS... options for a Content Management System
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Google Site ePort
Available w/ Google account
!
Pros
No cost
Easy to learn
Flexible
Somewhat scalable
Cons
Privacy?
Pages feel old-school
Blog-based ePort
Wordpress, Blogger, etc.
!
Pros
No to low cost
Easy to learn
Very flexible
Highly scalable
Cons
Themes limiting w/o CSS
$60 to host w/domain
!
NEW!
SITES @ PENN STATE »
Powered by WordPress
EASY way to create
Art pages hosted here »
Social-based ePort
LinkedIn, Facebook, etc.
!
Pros
No cost
Easiest to learn
Pages in FB easy to share
Cons
Not as flexible, scalable
Not customizable
Sometimes limited access
Other CMS-based ePort
Weebly, Apostrophe, OPP, etc.
!
Pros
Drag+drop content
Fairly easy to learn
Highly scalable
Your own www.domain.com
Cons
Most expensive option
Subscriptions limit mobility

21. Studio Art Making
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

22. Studio Art Making
Embed your content...
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

23. Embed your content...
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
External Web 2.0 platforms, including Sites @ Penn State
Google Sites
Easy image management, video embeds, document and external linking
Blog-based solutions
Easy (but sometimes process-particular) image management and embedding, doc and external linking
Social-media solutions
Easy (but sometimes localized) image management and embedding, doc and external linking
CMS solutions
Easy (but often localized) image management and embedding, doc and external linking
WebFiles-based HTML pages
TiddlyWiki
Image, doc and external links handled in “wiki-code” - shallow learning curve
Embeds handled through plug-ins or iframe code accessible “backstage”
HTML editors
Image, doc and external links via html code - steeper learning curve
Embeds handled via code

24. Studio Art Making
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

25. Studio Art Making
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share
Creating your network...

26. Creating your network... social media > social
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Reciprocal linking
Every web asset links to every other web asset
Be selective: avoid the “Nascar” problem
!
Reciprocal posting
Post one time to multiple environments
Get audience to blog, website from social media
!
RSS feeds
Blog posts show up in website
Social posts show up in website

27. Studio Art Making
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

28. Studio Art Making
Creating a feedback loop...
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Cloud
artifacts to
ePortfolio
Feedback
Critique
Reflection
Pin,
tweet,
share

29. Creating a feedback loop... critique beyond studio
ePortfolios how-to...
...Create your cloud
...Set up site
...Embed content
...Create your network
...Create feedback loop
Private conversations
Messaging, Skype, Email
Easy to send links
One-on-one feedback
!
!
!
Data analysis and insights
!
Register site with Google Analytics
!
See your audience habits
!
Number of visits
!
Demographics
!
Amount of time spent on site
!
Data suggests changes to make
!
Public conversations
Plus-1, Like, Comments
Broadcasting opinions
Get audience to do the footwork
Example from my Flickr account >>

30. Media Concentrations
Drawing + Painting
Printmaking
Sculpture
Ceramics
New Media

31. Art at Penn State Abington
http://www.abington.psu.edu/art
https://www.facebook.com/PennStateAbington.ArtProgram
http://newmediaabington.pbworks.com
@psa_art
Bonnie Levinthal | blevinthal@psu.edu
Yvonne Love
| ymm1@psu.edu
William Cromar | wrc11@psu.edu
!
John Thompson | hjt106@psu.edu