The document outlines a workshop led by Eleanor Stribling focused on using product development strategies to create an effective portfolio for impressing employers in the tech industry. Participants will learn to craft a compelling personal story, design a portfolio site, and highlight their skills through practical exercises. The workshop emphasizes the importance of storytelling and showcases various resources and tools for building an impressive portfolio.

1. Your Portfolio as a Product
How to use product development strategies to impress employers
Eleanor Stribling - @eleanorstrib
Codeland Conference
April 2017
Markusspiske, neourban hipster office desktop

2. Who am I & what am I doing here?
● Working in tech companies since 2008
● Been on both sides of the table in tech hiring process
● Tech worker with social science/business background who codes

3. Three things you will leave with today
● Plan for telling a compelling story about yourself to multiple audiences
● A sketch of your site and a plan to execute on it
● Links to resources from this workshop

4. Structure for the workshop
● Product management intro
● Getting started
● Pitching yourself to employers with an authentic, marketable story
BREAK - 20 mins
● Spec-ing the project
● Tools for a portfolio
● Q&A

5. How can product management help
with this project?

6. Why product management?
“Product Owner” by diogo.rendeiro,
https://www.flickr.com/photos/26649542@N07/
● Product management principles can be useful in
defining a project, especially with the “what” and
the “why”
● Asks questions like:
○ Who is using this?
○ What do they need?
● Combines design, tech & business

7. Get these things ready….
● Coding projects
○ 3+ projects (any size, live sites/runnable code)
○ Coursework is ok, put your own stamp on it, explain your process & challenges
● Source code samples online in your Github or other repo profile
● Up-to-date LinkedIn profile
● Sense of the type of job you will target: company size, industry & role
5 minutes

8. Portfolio sites are portals
“Liberty Portal in Naples” by Carlo Raso, https://goo.gl/MH2ZGy

9. Portfolio: What it is and what it isn’t
What it is
● Portal to your work as a programmer, your online home
● Easy to scan, access to more detail, see examples, contact you
● Conversation starter
What it isn’t
● Resume
● Cover letter
● Life story

10. Evaluate 3 portfolios
sampletechportfolio.com
Exercise 1 - 15 minutes

11. Storytelling in Your Portfolio
“Storytelling” by Steve McFarland

12. Audiences More technical
Less technical
Less time More time
Hiring managers
Future
co-workers
In-house
recruiters
Agency
recruiters

13. Write a user story
My portfolio site will enable
< person >
to
< action >
in order to
< task >
Exercise 2 -
Spend 10 minutes working this on
your own in your workbook, then
sharing in your group.

14. Write a user story
My portfolio site will enable
Engineering Managers
to
assess my skill level with JavaScript
in order to
invite me to interview for a front-end
developer role.
Sample

15. Write a user story
My portfolio site will enable
< person >
to
< action >
in order to
< task >
Exercise 2 -
Spend 10 minutes working this on
your own in your workbook, then
sharing in your group.

16. Find your story
Personal attribute
< thing >
Technical skill
< thing >
Soft skill
< thing >
Exercise 3 -
Spend 5 minutes working this on
your own in your workbook, then
share with a neighbor for about 2
minutes.
What did you learn?
Accomplishment
< thing >
Why I code
< thing >

17. Find your story
Personal attribute
Fast learner
Technical skill
Python, web apps in Django
Soft skill
Negotiations
Accomplishment
Built her own travel web app
Sample
Why I code
Want to build products that
make women’s lives easier

18. Find your story
Personal attribute
< thing >
Technical skill
< thing >
Soft skill
< thing >
Accomplishment
< thing >
Why I code
< thing >
Exercise 3 -
Spend 5 minutes working this on
your own in your workbook, then
share with a neighbor for about 2
minutes.
What did you learn?

19. You’re the person who...
Exercise 3 + -
Spend 3 minutes working this on
your own in your workbook, then
sharing with your group.
<your name>
is the person who
< thing >
and
< thing >

20. You’re the person who...
Sample
Eleanor
is the person who
built her own travel web app
and
is really good with Python.

21. You’re the person who...
Spend 10 minutes working this on
your own in your workbook, then
sharing with your group.
<your name>
is the person who
< thing >
and
< thing >

22. Highlighting your technical skills
“keyboard” by Marc Di Luzio, https://goo.gl/PFHsi6

23. Highest salaries (AngelList)
Source: https://angel.co/salaries

24. Skills in demand 2017 2016
SQL SQL
Java Java
Python JavaScript
JavaScript C#
C++ Python
C# C++
Perl PHP
iOS (Objective-C & Swift) iOS (Objective-C & Swift)
PHP Ruby/Rails
Source: CodingDojo analysis of listings on Indeed.com

25. Ways to explain proficiency
● Show projects with links to the code and outline the tech stack
● List in order of proficiency: strongest first
● List the number of years you’ve worked with the language, framework, etc
● Where is your strength with that language/framework

26. Pick the skills
you want to
highlight
Exercise 4 - 15 minutes

27. Building the site
“Scaffolding” by Tup Wanders, https://goo.gl/MH2ZGy

28. Things you already know about content
● Short
● Proofread - no spelling or grammar errors
● Tell a story, remember takeaways
● Have a high contrast, accessibility
● Choose a legible font that can be read in blocks of text
● No broken links
● Make it responsive to work well on all display sizes

29. Tools for building a static site
Color Schemes
Adobe Kuhler
Coolors
Paletton
Fonts
Google Fonts
Libraries
Bootstrap
Materialize
Recording
Quicktime
Screencastify (Chrome ext)
Hosting (static)
AWS
GitHub Pages
Jekyll
Domain registration
GoogleDomains
Hosting, registration & design
SquareSpace
Wix
Wordpress
Icons
FontAwesome
FlatIcon
Stock images
WOC in Tech
Flickr (creative commons)
Death to the Stock Photo
Templates
Colorlib (compilation)
Start Bootstrap
W3 Schools

30. Baking the portfolio cake!
Barb's Chocolate Raspberry Cake 15July06 - 2 by Roland Tanglao

31. Sketch your portfolio
Step 1: Get the ingredients
● Three projects you will use
● Links to your profiles on Github, LinkedIn, etc.
● Your story
● Skills you will highlight
● Message you want to send with your site -> your brand & why you code
Step 2: Bake the cake
● Sketch out a single page site in your workbook -> order, architecture,
messaging, colors (?)
● List other things you’ll need to complete it
Exercise 5 -
20 minutes

32. Getting it done
● Make rough sketches with pen and paper or use software:
○ PowerPoint/Keynote/Google Slides
○ Balsamiq
○ InVision
● Create separate issues for each task and organize
○ Each a clearly defined task
○ Put in order of priority
○ Practice using kanban “swim lanes” -- To Do, In progress, complete
● Show it to other people for feedback -- do they know what the story is?
● Give yourself a deadline (what’s yours?)
Take 5 minutes for this
exercise

33. Final thoughts
● Use what you have - keep building but leverage the great work you’ve
already done to show the progression in your skills
● Write good READMEs - show your process, challenge, strategy
● Put the link to your portfolio EVERYWHERE employers will find you
● Know your story and tell it - don’t forget the why
● Showcase the talents that you want employers to see
● Keep this site and your other profiles up to date

34. Thank you!