Various content updates, adding blog

About, projects, roles, talks edits. Restoring blog top page and one post, playing with Cursor.

README.md

@@ -20,21 +20,22 @@ Partly inspired by the philosophy of [learning in public](https://www.swyx.io/le
 - [x] showcase tag section thumbnail row
 - [x] WIP alert or something ("latest change" note?)
 - [x] home layout, article layout separate CSS
-- [ ] realign header and footer to uniform width for both layouts
+- [x] realign header and footer to uniform width for both layouts
 - [x] figure out Tufte images CSS
 - [x] redirect ericthebell.com
 - [ ] role pages content & images
 - [ ] projects pages content & images
 - [ ] thumbnails for everything
-- [ ] accolades on About page
+- [x] accolades on About page
 - [ ] better focused expertise & goals
 - [ ] collection pages for `tag`s
+- [ ] tag filterable view (projects, talks, roles)
 - [ ] second pass CSS styling
 - [ ] thumbnail grid tiling
 - [ ] portfolio page with tag filterable view (projects, talks, roles)
 - [ ] rename `portfolio` roles list to `career`
 - [ ] content management for Jekyll collections
-- [ ] add a blog?
+- [ ] restore blog page and update posts layout
 
 ## config
 

_config.yml

@@ -25,6 +25,10 @@ author:
   name: Eric Bell
   email: 
 
+# Add your copyright policy here
+copyright: "CC BY-SA 4.0"
+cc_license: "https://creativecommons.org/licenses/by-sa/4.0/"
+
 title: Eric Bell
 description: > # It will appear in your document head meta (for Google search results) and in your feed.xml site description.
   Holistic product and service design, making complexity feel simple. <a href="/assets/EricBell_Resume_2024.pdf">Resume (PDF)</a>
@@ -41,8 +45,8 @@ header_pages:
   - portfolio.md
   - talks.md
   - offerings.md
-#  - blog.md
   - about.md
+  - blog.md
 
 # 3.0 notes
 # Also, I can specify the skin now!
@@ -86,6 +90,11 @@ defaults:
       type: "talks"
     values:
       layout: "talk"
+  - scope:
+      path: "_posts"
+      type: "posts"
+    values:
+      layout: "post"
 
 collections: # blog is automatic collection of posts
   roles:

_includes/footer.html

@@ -8,11 +8,14 @@
       {%- if site.author %}
         <ul class="contact-list">
           {% if site.author.name -%}
-            <li class="p-name">{{ site.author.name | escape }}</li>
+            <li class="p-name"><p>{{ site.author.name | escape }}</p><li>
           {% endif -%}
           {% if site.author.email -%}
             <li><a class="u-email" href="mailto:{{ site.author.email }}">{{ site.author.email }}</a></li>
           {%- endif %}
+        {% if site.copyright %}
+          <li><a href="{{ site.cc_license }}">{{ site.copyright }}</a></li>
+        {% endif %}
         </ul>
       {%- endif %}
         <span class="feed-subscribe">

_layouts/post.html

@@ -1,5 +1,5 @@
 ---
-layout: default
+layout: tufte
 ---
 <article class="post h-entry" itemscope itemtype="http://schema.org/BlogPosting">
 

_layouts/talk.html

@@ -12,7 +12,7 @@ <h3>{{ page.headline }} </h3>
 
 {{ page.embed }}
 
-<div><a href="{{ page.link }}">{{ page.label }}</a></div>
+<p><a href="{{ page.link }}">{{ page.label }}</a></p>
 
 {%- include tags.md -%}
 

_posts/2017-02-28-comics-translation-to-cancer-treatments.md

@@ -2,7 +2,7 @@
 layout: post
 title: Comics translation to cancer treatments, a year in review
 date: 2017-Feb-28 18:52:00 -000
-summary: For my work life, 2016 was a year of transitions and contrasts
+summary: For my work life, 2016 was a year of transitions and contrasts.
 tags: startup healthtech career
 ---
 

_projects/hackathon-frood-frictionless-food-entry-on-mobile-2012-10.md

@@ -1,7 +1,7 @@
 ---
 layout: post
 title: 'Frood: frictionless food entry on mobile'
-company: Hackathon
+company: Side projects
 date: '2012-10-21T11:07:00-04:00'
 tags:
 - hackathon

_projects/hackathon-word-herd-crowdsourcing-business-taglines-2013-09.md

@@ -1,7 +1,7 @@
 ---
 layout: post
 title: 'Word Herd: crowdsourcing business taglines'
-company: Hackathon
+company: Side projects
 date: '2013-09-24T11:54:00-04:00'
 tags:
 - hackathon

_projects/hackathon-wtf-denied-explaining-benefits-better-2013-10.md

@@ -1,7 +1,7 @@
 ---
 layout: project
 title: 'WTF Denied: Explaining benefits better'
-company: Hackathon
+company: Side projects
 date: '2013-10-02T13:05:00-04:00'
 thumbnail: /assets/images/hack-wtf-thumb.png
 tags:

_roles/oneshots.md

@@ -1,7 +1,7 @@
 ---
 title: One-shots
 layout: role
-company: Hackathon
+company: Side projects
 logo: /assets/images/eric_viki.png
 tagline: Hackathons & freelance projects
 position: 
@@ -11,6 +11,4 @@ dateshow: 2012+
 tags: hackathon freelance oneshot
 ---
 
-## Hackathons & freelance projects
-
-Some projects
+Side projects and hackathons

_talks/2013-designers-at-hackathons.md

@@ -1,7 +1,7 @@
 ---
 layout: talk
 title: Designers @ Hackathons
-company: Hackathon
+company: Side projects
 summary: Talk at the IxDA event <a href="https://ixdasf.ning.com/events/ux-in-space-vol-2">UX in Space, Vol 2</a>, an event for design challenges in unusual contexts.
 
 formal: Designers @ Hackathons

_talks/2014-design-for-conversion.md

@@ -1,6 +1,7 @@
 ---
 layout: talk
 title: Design for Conversion
+company: Viki
 summary: Short presentation on common conversion flow patterns and approaches for tackling them.
 formal: 
 context: Speaker for an event hosted by Orange Hive accelerator in Singapore.

_talks/2015-uxd-omg-wtf-bbq.md

@@ -1,6 +1,7 @@
 ---
 layout: talk
 title: Parsing UX Design
+company: Side projects
 headline: A talk on UX design terminology, skillsets, and process
 summary: Breaking down UX titles and design process, a presentation and Q&A session at <a href="https://href.li/?http://www.createtogether.am/">#createTogether conference</a> in Yerevan, Armenia.
 context: <a href="http://www.createtogether.am/">#createtogether conference</a> in Yerevan, Armenia

_talks/2019-chain-of-custody.md

@@ -1,6 +1,6 @@
 ---
 layout: talk
-title: Chain of Custody
+title: Chain of Custody Handoff Patterns
 company: Vineti
 summary: Short talk at a Vineti-hosted health tech event, on some challenges and solution patterns around chain of custody in cell therapy treatments.
 
@@ -9,8 +9,8 @@ context: Design 4 Healthcare lightning talks event at Vineti's offices in San Fr
 date: 2019-11-01
 dateshow: 2019 Nov
 thumbnail: /assets/images/COC-handoff-patterns.png
-embed: 
-label: 
+embed: <img src="/assets/images/COC-handoff-patterns.png" alt="Chain of Custody handoffs">
+label: No link for this one!
 link: 
 tags: talk event Vineti oneshot
 ---

about.md

@@ -38,10 +38,10 @@ I've spent my career solving information and interaction problems, from "how can
 <figure class="fullwidth">
 	<label for="mn-2" class="margin-toggle">⊕</label>
 	<input type="checkbox" id="mn-2" class="margin-toggle">
-	<img src="/assets/images/career-timeline-simple.png" alt="career timeline">
+	<img src="/assets/images/career-timeline-minimal.jpg" alt="career timeline">
 </figure>
 
-The last six years I spent leading the design team at [Vineti](https://vineti.com/), where we built a platform to orchetsrate the next generation of cell nd gene therapy treatments. Before that I directed product design on the Rakuten Manga project, a platform for fans to translate digital comics into their own language, and I formed and facilitated the design team at Viki, a Rakuten subsidiary. I've worked at a small social media startup, design agencies in Tokyo and Seattle, and designed the Japanese input methods for Microsoft's erstwhile Windows Phone 7.
+**This past year** I supported [Al Jazeera's digital team](/roles/Al-Jazeera) to improve their design strategy and team processes. Recently, I spent six years leading the design team at [Vineti](/roles/Vineti), where we built a platform to orchetsrate the next generation of cell nd gene therapy treatments. Before that I directed product design on the Rakuten Manga project, a platform for fans to translate digital comics into their own language, and I formed and facilitated the design team at Viki, a Rakuten subsidiary. I've worked at a small social media startup, design agencies in Tokyo and Seattle, and designed the Japanese input methods for Microsoft's erstwhile Windows Phone 7.
 
 <div class="marknote">
 <label for="mn-3" class="margin-toggle">&#8853;</label>
@@ -51,9 +51,13 @@ The last six years I spent leading the design team at [Vineti](https://vineti.co
 	</span>
 </div>
 
-**Currently I'm looking** for *complex system & service problems* to work on, an *established design team* to learn from & mentor, who are *geographically distributed* with intentional onsites. 
+**Currently** I'm working on building out [HyeTech's](https://hyetech.io) operations with our small team, to better support connecting tech leaders and entrepreneurs.
 
-<!-- **I design things** based on the people who use them. I’m particularly good at wrapping my head around novel systems and making complexity understandable to its audience. I see most of these situations as information problems. My specialties are Interaction Design and Information Architecture. I approach products, services, and cross-channel experiences holistically. -->
+I'm also open for part time consulting engagements on . Check out my [offerings](/offerings) and [drop me a line](https://cal.com/ericthebell/office-hours).
+
+<!-- I'm looking for *complex system & service problems* to work on, an *established design team* to learn from & mentor, who are *geographically distributed* with intentional onsites. 
+
+**I design things** based on the people who use them. I’m particularly good at wrapping my head around novel systems and making complexity understandable to its audience. I see most of these situations as information problems. My specialties are Interaction Design and Information Architecture. I approach products, services, and cross-channel experiences holistically. -->
 
 <hr>
 

assets/css/style.scss

@@ -26,23 +26,31 @@ header.site-header {
   /* box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Optional: Adds a subtle shadow */
 }
 
+header .wrapper {
+  max-width: calc(800px -(30px));
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 15px;
+  padding-left: 15px;
+}
+
 header .tufte {
-  padding: 0 0 0 12.5%;
-  padding-right: 30px;
-  padding-left: 30px;
+  padding: 0 12.5% 0 12.5%;
+  /* padding-right: 30px;
+  padding-left: 30px; */
   margin-right: auto;
   margin-left: auto;
 }
 
 body {
-  /* width: 87.5%; */
+  /* width: 87.5%;
   margin-left: auto;
-  margin-right: auto;
+  margin-right: auto; */
   font-family: Merriweather Sans, Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;
   font-weight: 300;
   background-color: #fffff8;
   color: #111;
-  max-width: 1400px;
+  /* max-width: 1400px; */
   counter-reset: sidenote-counter;
 }
 
@@ -87,6 +95,14 @@ h3 {
   line-height: 1.3;
 }
 
+h4 {
+  font-family: Merriweather;
+  font-weight: 600;
+  font-size: 1.5rem;
+  margin-top: 0.2rem;
+  margin-bottom: 0.4rem;
+  line-height: 1.3;
+}
 .tufte hr {
   width: 55%;
 }
@@ -156,6 +172,12 @@ header a{
   border: none;
 }
 
+.site-nav .page-link {
+  color: #111111;
+  line-height: 1.5;
+  padding: 17px 10px 19px 10px;
+}
+
 a:hover {
   color: #131313;
   background-color: #fff7a5;

blog.md

@@ -2,33 +2,19 @@
 layout: default
 title: thoughts
 header: Sunsets from trains
-subtitle: A trains & cats person in the land of cars & dogs
+subtitle: A trains & cats information nerd
 permalink: /blog
 ---
 
 # {{ page.header }}
 
-## Latest thoughts
-
-<ul>
-  {% for post in site.posts %}
-  {% assign sortedPosts = site.posts | sort: 'date' %}
-    <li>
-      <h2><a href="{{ post.url }}">{{ post.title }}</a></h2>
-      {{ post.excerpt }}
-    </li>
-  {% endfor %}
-</ul>
-
-
 <div class="home">
   {% if site.paginate %}
     {% assign posts = paginator.posts %}
   {% else %}
     {% assign posts = site.posts %}
   {% endif %}
 
-
   {%- if posts.size > 0 -%}
     {%- if page.list_title -%}
       <h2 class="post-list-heading">{{ page.list_title }}</h2>
@@ -37,15 +23,13 @@ permalink: /blog
       {%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%}
       {%- for post in posts -%}
       <li>
-        <span class="post-meta">{{ post.date | date: date_format }}</span>
-        <h3>
+        <div class="post-meta">{{ post.date | date: "%Y %b %d"}}</div>
+        <h4>
           <a class="post-link" href="{{ post.url | relative_url }}">
             {{ post.title | escape }}
           </a>
-        </h3>
-        {%- if site.show_excerpts -%}
-          {{ post.excerpt }}
-        {%- endif -%}
+        </h4>
+        {{ post.summary }}
       </li>
       {%- endfor -%}
     </ul>

offerings.md

@@ -1,5 +1,5 @@
 ---
-layout: tufte
+layout: default
 title: offerings
 header: Offerings & Services
 # permalink: /offerings

talks.md

@@ -8,7 +8,7 @@ header: Speaking & Events
 # Talks I've given here and there
 
 {% for talk in site.talks reversed %}
-  <h2><a href="{{ talk.url }}">{{ talk.title }}</a></h2>
+  <h3><a href="{{ talk.url }}">{{ talk.title }}</a></h3>
   <p>{{ talk.date | date: "%Y %b" }}<br/>
   {{ talk.summary | markdownify }}</p>
   <div class="thumbnail">{{ page.thumbnail }}</div>