build your portfolio online in 2h
DESCRIPTION
Quickly and easily create your portfolio online in 2h on your iPad or your computer to share each of your achievments on social network or by QR code. The iPad could display it offline too. Try the free version on http://www.tabfolio.me to evaluateTRANSCRIPT
![Page 1: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/1.jpg)
Goal: post my portfolioonline in 2 hours
I use my desktop computer (Win or Mac)
![Page 2: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/2.jpg)
The steps
1. Brainstorming: what do I need for further display ?2. I collect my pictures3. I get my text in shape4. I build up my portfolio5. I input interface texts6. I fill out my gallery7. I fill out my page8. I fill my home (page)9. I fill out my contact form
10. I post
Jump to advanced features
![Page 3: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/3.jpg)
1 - Brainstorming
Advice1. A portfolio is not a picture catalog2. A portfolio contains my best pictures3. A portfolio is build to sell me4. A portfolio should introduce myself
My requirements● I am limited to 8 boards for my gallery
My record1. I am a wildlife photographer2. I want to highlight one race inconspicuous: the chins3. I want to introduce myself
My plan1. Home2. My page "About"3. My galerie of Snoop & Toufoo, 2 illustrious chins
![Page 4: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/4.jpg)
2 - I group my pictures
Advice● I use my source images, I reformaterais in tabFolio● I use mostly pictures of more than 200 kb
My requirements1. A gallery must have 8 boards maximum2. The board format used must be compatible with iPhone
![Page 5: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/5.jpg)
3 - My texts
Advice1. A portfolio is not a website, but a business card, a preview2. A portfolio should not be limited to photos
My requirements● I use layouts with predefined styles
Home● My last
About1. My past2. My training
Contact1. My details
![Page 7: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/7.jpg)
5.1 - Edit textMode change
1/ I use the editor palette
2/ I switch to text editing
![Page 8: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/8.jpg)
5.2 - Edit textChoice of texts
My header1. I click on "My name" to
replace "AnomaPics"2. I click on "My activity" to
replace "Photo Animalière"
My browsing1. I click on "Bio" to
replace "A propos"2. I click on "Gallery" to
replace "Exemples"3. I click on "Le lorum..." to
replace "Me contacter"4. I click on "© My name,
2012" to replace "© AnimaPics, 2012"
The header
Browsing
6 texts to modify in 2 areas
![Page 11: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/11.jpg)
6.1 - Editing imagesMode change
1/ I go to my gallery
2/ I switch to image editiing
3/ I click on the picture to replace
![Page 12: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/12.jpg)
6.2 - Editing imagesImage upload
1/ My picture is on my computer, I click on Add a média
2/ I drag my picture on the drop zone
3/ My picture is uploaded
![Page 13: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/13.jpg)
6.3 - Editing imagesImage formating
I can edit the image● zoom in, zoom out● crop● rotate
![Page 15: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/15.jpg)
7.1 - Editing the pageTexts replacement
1/ I go to my page
2/ I replace the texts
3/ I check out
![Page 16: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/16.jpg)
7.2 - Editing the pageImage import from the web
1/ I replace the images
2/ I copy my website url where my picture is
3/ I confirm the url and display the pictures
4/ I import my image
![Page 17: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/17.jpg)
7.3 - Editing the pageAdd a link to a picture
1/ I select the picture
2/ I input or paste the website url
![Page 18: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/18.jpg)
8 - Editing the home
2/ I replace the texts
3/ I replace the picture
1/ I return to home
4/ I check out
![Page 19: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/19.jpg)
9 - Editing the form
3/ I replace the texts
2/ I replace the picture
1/ I display the form
4/ I check out
![Page 20: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/20.jpg)
10 - Publication
3/ I change the font
1/ I display the settings window
2/ I click on Interface
4/ I configure my publishing
5/ I publish
![Page 21: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/21.jpg)
Communicate & share
I share my page on all social network
I get on my computerthe QR code achievements
to show it when we speak of me
![Page 22: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/22.jpg)
I switch to advanced modeI will be able to
● Display on button click (and build it if necessary):○ a page and go straight to a line, ○ a gallery and go straight to a slide, ○ a menu,○ the contact form
● For each page:○ add / delete line○ order llines○ move a line to another page○ display parameters and SEO
● For each gallery: ○ add / delete slide○ order slides○ move a slide to another gallery○ display parameters and SEO
![Page 23: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/23.jpg)
The new steps
11. Brainstorming: what do I need for further display more ?12. I display the advanced features13. I add a menu "Galleries"14. I fill out this menu and build a second gallery15. I fill out the second gallery16. I build the "About" tab17. I add a movie to my page "Actuality"18. I add a link to my home19. I publish
![Page 24: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/24.jpg)
11 - New brainstorming
My requirements● I am limited to 3 boards of 8 slides
My goal1. I would like to highlight a second race less visible : the African grey parrot2. I would like to display a movie3. I would talk about my news and the chins origin
My new plan1. Home2. My "About" tab3. My "News" page4. My "Galleries" menu5. My existing gallery about Snoop & Toufoo, 2 illustrious chins6. My new galerie about Leon, the parrot
![Page 25: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/25.jpg)
12 - Advanced features
1/ I display settings window
2/ I click on Interface
3/ I check in the box
4/ 2 buttons appaired
![Page 26: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/26.jpg)
13.1 - Add a menuSelect, template choice
1/ I switch editing buttons
2/ I select the button
3/ I click on Menu
4/ I go straight to the wanted template
![Page 27: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/27.jpg)
13.2 - Add a menuSettings
I can preview some exemples
1/ I input the menu name
2/ I valid the template choice
3/ I save
4/ I check out
![Page 28: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/28.jpg)
14.1 - Menu contentAdd image, input
1/ I switch editing image
2/ I import my images
3/ I input my texts
![Page 29: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/29.jpg)
14.2 - Menu contentBuild a gallery
1/ I switch to editing buttons
3/ I click on Gallery
2/ I select the button
4/ I go straight to the wanted template for the first slide
5/ I input the gallery name
6/ I valid the template choice
![Page 30: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/30.jpg)
15.1 - Gallery contentAdd a picture, input
1/ I go to the gallery
2/ I import picture
3/ I input texts
![Page 31: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/31.jpg)
15.1 - Gallery contentAdd a slide
1/ I switch to editing gallery
3/ I choose the place
2/ I go straight to the wanted template
4/ I valid the template choice
![Page 32: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/32.jpg)
16.1 - Add a tabSettings, input
1/ I switch to editing buttons
2/ I select the button
4/ I choose the tab template
5/ I input texts
3/ I click on Menu
![Page 33: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/33.jpg)
16.2 - Add a tabAdd a picture, template settings
1/ I import my pictures
2/ I switch to editing area
3/ I select the area (the tab)
![Page 35: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/35.jpg)
16.4 - Add a tabAdd a link
1/ I select the button
2/ I click on Page
3/ I click on Display page
4/ I go straight to the gallery to display
5/ I go straight to the slide to display
![Page 36: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/36.jpg)
17.1 - Add a movieImage replacement, association
1/ Je select the picture
2/ I associate an action
3/ I click on Movie
4/ I paste Youtube url
5/ I check out
![Page 38: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/38.jpg)
18.1 - Add a linkSelection
1/ I return to Home
2/ I sélect the text
3/ I associate an action
![Page 39: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/39.jpg)
18.2 - Add a linkSettings
1/ I click on Gallery
2/ I click on Display a gallery
3/ I go straight to the gallery to display
4/ I go straight to the slide to display
![Page 40: Build your portfolio online in 2h](https://reader034.vdocument.in/reader034/viewer/2022052412/559596e71a28abb81e8b46ed/html5/thumbnails/40.jpg)
19 - New publishing
1/ I display the settings window
3/ I publish
2/ I input the Google Analytics code