ITP portfolio

sample portfolio page

>Goal: Increase documentation and adding to the projects database by providing value to the process. Most people don’t have time to make a portfolio page, and this will allow them to easily create one as they go instead of at the last minute. Value and incentive are increased to both document and use the floorsquare API because using it may increase your exposure to classmates, faculty and the public. We also wanted to have the ability to browse and search old projects in the database through a more comprehensive projects gallery to supplement the one on the main page.

project portfolio zip file:

>languages: jquery, php, html5, mysql


projects database: mysql database populated through the projects database form. relevant data we pulled from it for this project includes: project name, userid, abstract (elevator pitch), class it was made in, venue it was shown in, media assets like an image or video  

config file: how your name will be displayed on your portfolio page and login information for the database

php serving scripts: these scripts pull data from the database and injects it wherever on a profile page the variable is called. the different variables are: {:name:} = name of the person; {:visual:} = the main image from the project;  social media variables: {:blog:} , {:facebook:} , {:googleplus:}, {:twitter:} , {:flickr:} , {:soundcloud:}, {:vimeo:} , {:youtube:}, {:linkedin:}, {:gdgt:} , {:github:}

html template files: these files are templates for the php scripts. they have the variables. they are styled with bootstrap, css, jquery

image files: texture, file identification; these files are used for styling

preferences.txt: the user can complete this text file to link their social media profiles to their portfolio as well as set how their             name is displayed on the portfolio page

bootstrap: styling and features like dropdown menus and modals


    portfolio main page: a grid of all your projects. Includes the variables: {:name:}, {:abstract:}, {:visual:}

portfolio about page: information about the artist. This page needs to be edited by the student

portfolio project detail: detail information of the project. Includes the variables:  {:name:}, {:title:}, {:abstract:}, {:visual:}, {:media:},  {:venue:}, {:course:}, {:description:}

>project gallery

    main page: a grid of all projects in the database, paginated, Search box with queries filtered by artist name, project name, and keywords. Variables include {:title:}, {:visual:}, {:allCourses:}, {:allVenues:}

project gallery detail page: just like the individual project page in the portfolio, styled differently

lottery (api): to be created.

>Benefits: make your portfolio as you go through ITP, not after it. Increase your exposure in places other than the show like the waverly screen. Increase collaboration by letting your classmates know what you are doing. Profile pages are fully customizable through changing the CSS provided in bootstrap.css and profile.css. Project gallery: browse past projects and what your classmates are you doing.

>Longevity: There are a few things that encourage the adoption of the projects database and portfolio utility. One, people dont really see any value of putting their projects into the database. We found out from Tom Igoe that the projects database is a major tool for organizing large events like the semester shows and publicizing big screens. But not everything we do falls into those spaces. But now, when people add projects to the database, they build their portfolio page on their journey at ITP. Students can have piece of mind knowing that their work will have a presence online as long as they take time to document and submit. These pages have the opportunity to be dynamic and media rich because they can upload media. They have full control over the site as well, and can bring as many advanced techniques their hearts can support.

With styling and layout being open, the portfolio can also be a framework the faculty can use to teach html in comm lab. We can imagine assignments to setup and style one’s site.

With the project gallery search, students can peer into and browse ITP’s past. They can search the ideas that former ITP students succeeded realizing. They can extend well documented projects. With floorsquare connectivity, they have the opportunity to enjoy serendipitous moments of discovery.

The lottery is another feature that can encourage project database use. Exposure is a popular commodity at ITP. Using floorsquare to use floorservices enters you into a lottery that will display your work o a number of screens, inward and public facing. This increased exposure can introduce students to both internal and external collaborators interesting in helping or contributing to their effots.

The projects gallery and portfolio put your ITP experience in context.

Here is a professional portfolio we looked at as inspiration.

here is ours.

Improvements: We need to create the lottery page, connected to the floorsquare API.

acknowledgements: Ahmad Arshad, Dan O’Sullivan, Kate Watson, Understanding Networks, Tom Igoe

project gallery detail pageProject Galley

project detail page

portfolio project detail page