<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="3.9.3">Jekyll</generator><link href="https://pifafu.com/feed.xml" rel="self" type="application/atom+xml" /><link href="https://pifafu.com/" rel="alternate" type="text/html" /><updated>2023-11-20T23:13:55+00:00</updated><id>https://pifafu.com/feed.xml</id><title type="html">pifafu’s tiny site</title><subtitle>I'm Kathy, I design for work and make things for fun.</subtitle><entry><title type="html">Example</title><link href="https://pifafu.com/design/2022/07/11/profile-README.html" rel="alternate" type="text/html" title="Example" /><published>2022-07-11T00:00:00+00:00</published><updated>2022-07-11T00:00:00+00:00</updated><id>https://pifafu.com/design/2022/07/11/profile-README</id><content type="html" xml:base="https://pifafu.com/design/2022/07/11/profile-README.html">&lt;p&gt;Cool. You’ll find this post in your &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;_posts&lt;/code&gt; directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;jekyll serve&lt;/code&gt;, which launches a web server and auto-regenerates your site when a file is updated.&lt;/p&gt;

&lt;p&gt;Jekyll requires blog post files to be named according to the following format:&lt;/p&gt;

&lt;div class=&quot;language-plaintext highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;YEAR-MONTH-DAY-title.MARKUP
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;Where &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;YEAR&lt;/code&gt; is a four-digit number, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;MONTH&lt;/code&gt; and &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;DAY&lt;/code&gt; are both two-digit numbers, and &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;MARKUP&lt;/code&gt; is the file extension representing the format used in the file. After that, include the necessary front matter. Take a look at the source for this post to get an idea about how it works.&lt;/p&gt;

&lt;p&gt;Jekyll also offers powerful support for code snippets:&lt;/p&gt;

&lt;figure class=&quot;highlight&quot;&gt;&lt;pre&gt;&lt;code class=&quot;language-ruby&quot; data-lang=&quot;ruby&quot;&gt;&lt;span class=&quot;k&quot;&gt;def&lt;/span&gt; &lt;span class=&quot;nf&quot;&gt;print_hi&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;nb&quot;&gt;name&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;)&lt;/span&gt;
  &lt;span class=&quot;nb&quot;&gt;puts&lt;/span&gt; &lt;span class=&quot;s2&quot;&gt;&quot;Hi, &lt;/span&gt;&lt;span class=&quot;si&quot;&gt;#{&lt;/span&gt;&lt;span class=&quot;nb&quot;&gt;name&lt;/span&gt;&lt;span class=&quot;si&quot;&gt;}&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;&lt;/span&gt;
&lt;span class=&quot;k&quot;&gt;end&lt;/span&gt;
&lt;span class=&quot;n&quot;&gt;print_hi&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;s1&quot;&gt;'Tom'&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;)&lt;/span&gt;
&lt;span class=&quot;c1&quot;&gt;#=&amp;gt; prints 'Hi, Tom' to STDOUT.&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/figure&gt;

&lt;p&gt;Check out the &lt;a href=&quot;https://jekyllrb.com/docs/home&quot;&gt;Jekyll docs&lt;/a&gt; for more info on how to get the most out of Jekyll. File all bugs/feature requests at &lt;a href=&quot;https://github.com/jekyll/jekyll&quot;&gt;Jekyll’s GitHub repo&lt;/a&gt;. If you have questions, you can ask them on &lt;a href=&quot;https://talk.jekyllrb.com/&quot;&gt;Jekyll Talk&lt;/a&gt;.&lt;/p&gt;</content><author><name></name></author><category term="design" /><summary type="html">Cool. You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.</summary></entry><entry><title type="html">Identity</title><link href="https://pifafu.com/framing/2022/06/21/identity.html" rel="alternate" type="text/html" title="Identity" /><published>2022-06-21T03:14:59+00:00</published><updated>2022-06-21T03:14:59+00:00</updated><id>https://pifafu.com/framing/2022/06/21/identity</id><content type="html" xml:base="https://pifafu.com/framing/2022/06/21/identity.html">&lt;p&gt;Cool.&lt;/p&gt;

&lt;p&gt;You’ll find this post in your &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;_posts&lt;/code&gt; directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;jekyll serve&lt;/code&gt;, which launches a web server and auto-regenerates your site when a file is updated.&lt;/p&gt;

&lt;p&gt;Jekyll requires blog post files to be named according to the following format:&lt;/p&gt;

&lt;p&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;YEAR-MONTH-DAY-title.MARKUP&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Where &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;YEAR&lt;/code&gt; is a four-digit number, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;MONTH&lt;/code&gt; and &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;DAY&lt;/code&gt; are both two-digit numbers, and &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;MARKUP&lt;/code&gt; is the file extension representing the format used in the file. After that, include the necessary front matter. Take a look at the source for this post to get an idea about how it works.&lt;/p&gt;

&lt;p&gt;Jekyll also offers powerful support for code snippets:&lt;/p&gt;

&lt;figure class=&quot;highlight&quot;&gt;&lt;pre&gt;&lt;code class=&quot;language-ruby&quot; data-lang=&quot;ruby&quot;&gt;&lt;span class=&quot;k&quot;&gt;def&lt;/span&gt; &lt;span class=&quot;nf&quot;&gt;print_hi&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;nb&quot;&gt;name&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;)&lt;/span&gt;
  &lt;span class=&quot;nb&quot;&gt;puts&lt;/span&gt; &lt;span class=&quot;s2&quot;&gt;&quot;Hi, &lt;/span&gt;&lt;span class=&quot;si&quot;&gt;#{&lt;/span&gt;&lt;span class=&quot;nb&quot;&gt;name&lt;/span&gt;&lt;span class=&quot;si&quot;&gt;}&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;&lt;/span&gt;
&lt;span class=&quot;k&quot;&gt;end&lt;/span&gt;
&lt;span class=&quot;n&quot;&gt;print_hi&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;s1&quot;&gt;'Tom'&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;)&lt;/span&gt;
&lt;span class=&quot;c1&quot;&gt;#=&amp;gt; prints 'Hi, Tom' to STDOUT.&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/figure&gt;

&lt;p&gt;Check out the &lt;a href=&quot;https://jekyllrb.com/docs/home&quot;&gt;Jekyll docs&lt;/a&gt; for more info on how to get the most out of Jekyll. File all bugs/feature requests at &lt;a href=&quot;https://github.com/jekyll/jekyll&quot;&gt;Jekyll’s GitHub repo&lt;/a&gt;. If you have questions, you can ask them on &lt;a href=&quot;https://talk.jekyllrb.com/&quot;&gt;Jekyll Talk&lt;/a&gt;.&lt;/p&gt;</content><author><name></name></author><category term="framing" /><summary type="html">Cool.</summary></entry><entry><title type="html">Profile Readme</title><link href="https://pifafu.com/design/2022/06/21/profile-README.html" rel="alternate" type="text/html" title="Profile Readme" /><published>2022-06-21T03:14:59+00:00</published><updated>2022-06-21T03:14:59+00:00</updated><id>https://pifafu.com/design/2022/06/21/profile-README</id><content type="html" xml:base="https://pifafu.com/design/2022/06/21/profile-README.html">&lt;p&gt;READMEs provide a canvas for developers to curate their developer identity.&lt;/p&gt;

&lt;p&gt;Before this ship, user profiles were largely structured around high level elements like pinned repositories and low level metrics like daily contributions or summaries of activity by month. Profile READMEs provide GitHub users expansive flexibility in representing themselves and their work.&lt;/p&gt;

&lt;div class=&quot;full-width image-block&quot;&gt;
  &lt;img src=&quot;https://user-images.githubusercontent.com/5679180/178640105-3319f914-deb3-44a3-b11d-4a65a76c6a0d.png&quot; class=&quot;image-nice&quot; /&gt;
&lt;/div&gt;

&lt;p&gt;Before this ship, GitHub user profiles were largely structured by elements that provided proof of contribution, such as pinned repositories and contribution graph. It was difficult for users to curate a more holistic view of their developer identity; the diversity and richness of developer work was thusly somewhat flattened by the profile.&lt;/p&gt;

&lt;p&gt;Instead of introducing more modular components to the profile to surface different kinds of information, we explored adding READMEs to profiles. READMEs were a compelling addition due to their ubiquity on GitHub — in addition to providing a canvas for writing and expression, they would be a familiar pattern.&lt;/p&gt;

&lt;p&gt;READMEs were already ubiquitous on repositories and provided a canvas where users got to decide what information was shared and how it was designed. Since READMEs already served as customizable cover page for repositories, they offered a reusable and extensible solution.&lt;/p&gt;

&lt;p&gt;Profile READMEs will provide GitHub users more flexibility and space in sharing who they are on their profile page. It will allow users to fill in the gaps on their current GitHub profiles, which &lt;em&gt;do&lt;/em&gt; help users elevate their popular repositories and contribution activity, but &lt;em&gt;don’t&lt;/em&gt; help users share a narrative or allow for much creative expression. We’ve seen READMEs work very well for repositories, and we want to extend this capability to our users:&lt;/p&gt;

&lt;p&gt;&lt;img width=&quot;1296&quot; alt=&quot;Profile README on user profile&quot; src=&quot;https://user-images.githubusercontent.com/5679180/85786229-e9385700-b6de-11ea-8ede-37c3da4b249b.png&quot; /&gt;
&lt;img width=&quot;1296&quot; alt=&quot;Messaging that the user/user repository is special now!&quot; src=&quot;https://user-images.githubusercontent.com/5679180/85788239-83010380-b6e1-11ea-92e1-bb876f7e82ff.png&quot; /&gt;&lt;/p&gt;

&lt;h2 id=&quot;thinking-what-do-our-users-think&quot;&gt;:thinking: What do our users think?&lt;/h2&gt;
&lt;p&gt;We first &lt;a href=&quot;https://twitter.com/pifafu/status/1262830019706892288&quot;&gt;asked users&lt;/a&gt; what they wanted to share about themselves, and then saw an &lt;strong&gt;&lt;a href=&quot;https://twitter.com/pifafu/status/1265773172520914944&quot;&gt;overwhelmingly positive response&lt;/a&gt;&lt;/strong&gt; to @mikekavouras’s initial spike of this feature when it was shared out on Twitter (the tweet went viral almost immediately, having reached almost &lt;strong&gt;1 million impressions&lt;/strong&gt; so far).&lt;/p&gt;

&lt;p&gt;On top of requesting to be added to the feature, many users thought that, with this README, their profile will get closer to being a résumé. We can interpret this to mean that many users feel that the current GitHub profile is not an adequate representation of their developer experience and history and &lt;em&gt;would like it to be&lt;/em&gt;.&lt;/p&gt;</content><author><name></name></author><category term="design" /><summary type="html">READMEs provide a canvas for developers to curate their developer identity.</summary></entry></feed>