/2015-Portfolio

Practicing a 2 week web-project's design process

Primary LanguageCSS

#Design Process

These are my process notes for designing & developing this portfolio.


##Goals Project Management: Design my portfolio in 2 weeks.

User focused: A recruiter can quickly & enjoyably learn about my professional work.

future user goals

  1. A user interested can spend lots of time learning about my design process.

  2. A designer or coder can immediately understand the value of the way I presented the essence of my work/personal brand.

##Schedule

  • Tuesday 2h [goals, audiences, content]
  • Wednesday 2h [design wireframe]
  • Thursday 2h [wireframe, write about me's]
  • Friday 2h [step back:grid analysis, code wireframe]
  • Saturday a lot [design new wireframe, code new wireframe, brand analysis, visual design, continual visual cleanup, refactoring code]
  • Sunday
  • Monday 1hr [Toy with work-items]
  • Tuesday 1hr [add all work-items]
  • Wednesday personal day
  • Thursday [my story, refactor code]
  • Friday [interactions UX, js]
  • Saturday [anticipatory oh shit I didn't finish time]
  • Sunday [document process, version 1.0 release]

##Most Important Content

  • about me (personal brand)
  • I show my work or experience
  • the process of creation is communicated
  • social connect

which leads to... features

##Features

  • short intro
  • work pieces
  • process pages
  • connect icons @ bottom

##Branding

wordcloud:

design & code, tech, sleek, info, *concrete, data is beautiful, polished, flat, straight, beautiful, 
emotions: intelligence, creativity, modern, passion, dedicated, mindful, 

##Quality assurance

  • responsive
  • good UI (grid / layout fundamentals)
  • good UX (intuitive interactions)
  • visual design (branding)
  • Information Arch

#Site Content

Jotting down specific content I feel is valuable to include.


full project-list

  • hsl color scale [javascript, data viz]
  • svg animation [SVG, open-source, documenting processchanged what was possible on the internet]
  • visualDB [visual design, MV* architecture, AJAX, design process, web-apps, routing, Angular.js, visual to show]
  • HackTV [Team collaboration, changes the way people code, Angular, Node, MV* frameworks] prove: Github, google attention, yhack]
  • Baskets.io [d3, coffeescript, big-data, data visualization, make humans more productive] prove: Hackbeanpot
  • IBM- ODC not primary concern
  • IBM - PI [team collaboration, design process, design research, data preperation, market research, user testing, communication (presentation)
  • IBM - PI+ [team collaboration, design process, data visualization, IA, visual design, essnce--> product] prove: patent, real team
  • IBM - Query
  • Staples - Wiki
  • Staples - Requestor
  • Dylan.com [help humans be better, solve a real problem, design process]

projects that: have an impressive result. a well-documented process. I learned a lot from.

Chosen Projects (for now):

  • SVG animation -jqueryrain, others
  • Query (IBM)
  • D3.js [hsl, colorChooser, first graph, baskets]

##Process Pages

###Visual DB

Process

personas: newbie, pro

pain:

technologies

###IBM Maelstrom

microproject -Design Thinking, research & strategy sponsor-project -Interdisciplinary collaboration, design thinking, development

About Me

design & code

design mission satement -bard -neu -ibm

empathetic designer & dedicated developer? student at NEU FeD @ IBM meditator @ design thinking and FeD team driven, x design & code, x NEU IBM user focused design

##Ideas

-tags for projects (Front Dev, design research, etc) -highlights for key words in about me

  • section for ideas and their value
  • Personal life? (meditation)
  • writing work-items? (communicate Bard value)

##Versions 0.8 -over the fold done o missing work items & connect 0.9 o missing contact / connect / social buttons

These features were omitted due to time-constraints but are regarded as highly important 1.1 o Project Pages

Other Important Features o instead of responsive... full mobile version o more original concept to communicate my brand (value) o design process on homepage o replace CSS with Sass o User Testing -Real life user testing -Google Analytics -Heatmap