
<h4>Empowering Indies worldwide.</h4>
<p>On July 1, 2021, 2C announced long-awaited plans for the IndieDAO.</p>
<p>Expert Indie designers and developers around the world can now become members of <strong>The 2C IndieDAO</strong>. We are building the best freelance network in the world, so that Indies can live their dream, without all the hassle.</p>
<p><em>Update: The IndieDAO has launched on October 1st, 2021. Applications will be available soon for designer and developer Indies!</em></p>
<p><em>Update: The IndieDAO has begun to formalize it’s legal and operational frameworks, taking a giant leap towards complete decentralization and a long term hyper-structure foundation, beginning January 1st, 2023.</em></p>
<p><a href="https://twitter.com/theindiedao">👉🏼 <strong>Join the 2C Indie DAO</strong> ✨</a></p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*8XDTcLmSzd8WuXYMq9wQTw.jpeg"></figure><h3>What is a DAO?</h3>
<p>A DAO, or Decentralized Autonomous Organization, is a digital entity that allows a distributed group of members to manage assets and decision making. Members interact through a shared governance model, enforced by smart contracts on a blockchain.</p>
<h3>Working independently is tricky.</h3>
<p>Being an independent, a “freelancer” or an “Indie”, can be risky, challenging, and rewarding. Being responsible for your own business practice grants freedom and flexibility, but also comes with serious drawbacks.</p>
<blockquote>The 2C network picks up responsibility for the mundane, and allows Indies to focus on what they love. Keep the flexibility and independence, but ditch the boring business parts.</blockquote>
<p><strong>Responsibilities of the Indie lifestyle:</strong></p>
<ul>
<li>✅ <strong>Constantly honing skills to remain expert in your field</strong>
</li>
<li>☑️ Creating and marketing your brand <em>— provided by 2C</em>
</li>
<li>☑️ Pitching to clients <em>— provided by 2C</em>
</li>
<li>☑️ Negotiating sales deals <em>— provided by 2C</em>
</li>
<li>☑️ Finding good teammates <em>— provided by 2C</em>
</li>
<li>☑️ Doing administrative work <em>— provided by 2C</em>
</li>
<li>✅ <strong>Get paid</strong>
</li>
</ul>
<p>We handle the work pipeline, customer management, and time consuming marketing &amp; admin work, so that Indies can focus on their specialization. Instead of working solo on a gig platform, Indies can join teams at 2C and live their Indie dream.</p>
<p><em>2C has served dozens of Indies since 2018, and carries huge plans to continue improving the Indie experience.</em></p>
<p>We realize this model is providing tremendous value, but will eventually trend towards a traditional corporate model, unless we do something to change it. In order to maximize 2C’s chance of long-term success, and avoid the pitfalls of traditional corporations, we’ve decided to implement The IndieDAO as a governing entity in the ecosystem. The DAO will incrementally receive network governance power, business support, and cash grants from 2C, beginning with an initial grant of <strong>$25,000</strong> on October 1st, 2021.</p>
<h3>Rethinking the future of work.</h3>
<p>Two’s Complement (2C) was initially founded in 2018 by Indie designer <a href="https://twitter.com/0xKaty">Katy Jeremko</a> and Indie developer <a href="https://twitter.com/nico_valencia">Nico Valencia</a>. In late fall, they volunteered to help organize ETHBerlin and transformed inspiration from the event into a distributed network that supports the Indie lifestyle. In order to unpack the significance of implementing a DAO within 2C, we need to begin with a brief context of historical business organizations:</p>
<h4>Corporations</h4>
<p>A result of the Industrial Revolution — corporations emerged as a method for pooled resources to build manufacturing pipelines and limit risk for associated members. The required tools were far too expensive for a single worker to afford, so investors would provide capital, and executive leaders would protect the interest of the investors. This system was disruptively effective, and allowed tremendous growth for hundreds of years.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/572/0*HEHZBz9vW6dy4uAT"></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/541/0*A9Q8GNpHyUcRCcCf"></figure><p>Unfortunately — an unintended consequence — corporations produced an extreme wealth gap due to the centralization of risk, control, and profit. Corporations were an incredible advance in business technology, but we have outgrown their direct need for the majority of workers.</p>
<h4>Gig Economy</h4>
<p>The media has focused on Gig Economy marketplaces disrupting classic corporate models. These marketplaces award schedule flexibility to workers by providing a platform to match available workers to jobs. Unfortunately, most of the control and profit remains with the investors and executives, while flexibility is actually paid for by workers accepting some of the risk involved with market volatility.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/516/0*hbRoKy60e--5w8QJ"></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/528/0*tBZmWxWvxnJImVYM"></figure><p>The larger consequence of the Gig Economy is an intense <em>“Race to the Bottom”</em>. Most marketplaces for professional services are designed such that competition drives a good bargain for the customer. The unintended consequence is a model that incentivizes customers to match with the <strong>lowest acceptable quality</strong> at the <strong>lowest acceptable hourly rate</strong>. This drives worker compensation down and pushes expert specialists out of the marketplace. A preferred Indie model would highlight expert specialists that will result in the most cost effective overall solution for a customer.</p>
<p>Gig Economy continues to evolve, but an even bigger disruptive force may end Gig Economy’s transition early.</p>
<h4>DAOs</h4>
<p>A DAO (Decentralized Autonomous Organization) properly distributes risk, control, and profit to its members. DAOs blend the benefits of corporations and Gig Economy into a more efficient and profitable system for all members. Blockchain smart contracts allow members to organize and govern the organization’s operation and assets in a trustless system.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/505/0*Q6s9E8AAYJPNLliu"></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/513/0*MqnQWhCeWz5tSTCd"></figure><p>Rules are programmed onto the blockchain, and enforced programmatically, creating a fair and transparent mode of operations. Private and complex legal agreements between privileged wealthy parties are replaced with an active community of workers, who vote on policy and asset management.</p>
<p>DAOs may have been a more effective model than corporations, though the required blockchain technology didn’t exist over 200 years ago. The maturity of DAO technology is finally reaching a point capable of transforming entire industries into a more effective and equitable model, largely capable of outperforming traditional corporations.</p>
<h3>The IndieDAO</h3>
<p><em>Enter The IndieDAO.</em></p>
<p>We have invested the past several years designing and bootstrapping a consulting practice that will lend itself to an extraordinary transformation. Rather than bootstrapping a DAO from our inception, we’ve offered a hypothesis that incrementally migrating layers of a traditional corporate model into a DAO will increase our chances of eventual success at scale.</p>
<p>2C has designed an incremental approach that will systematically transform a services corporation into a DAO, while optimizing its growth potential along the way. The approach focuses on continuously testing and maturing governance protocols in order to minimize the amount of risk that early members must bear.</p>
<p>Our goal is to design the best Indie network in the world, so that Indies can live their dream without all the hassle. The IndieDAO is optimized for <strong>flexibility</strong>, <strong>fairness</strong>, and <strong>fun</strong>.</p>
<h3>Flexible 📅</h3>
<h4><strong>Work</strong></h4>
<ul>
<li>Indies match to work engagements that fit their life schedule</li>
<li>Indies choose when to work extra hard, and when to rest</li>
<li>Indies can mix project and personal work, as they choose</li>
</ul>
<h4><strong>Location</strong></h4>
<ul>
<li>Indies live wherever they want</li>
<li>Asynchronous optimized project workflows minimize meeting requirements, and maximize global collaboration</li>
</ul>
<h4><strong>Technology</strong></h4>
<ul>
<li>Indies select projects that fit their preferred technology and design specialization</li>
<li>Edge-technology opportunities provide continued specialization growth</li>
</ul>
<h3>Fair ⚖️</h3>
<h4><strong>Ownership</strong></h4>
<ul>
<li>Indies earn ownership and governance in the Indie DAO, as they contribute their skills and time to the community</li>
<li>Community earnings are governed by a diverse and active community, not a narrow percent of wealthy individuals</li>
</ul>
<h4><strong>Experimentation</strong></h4>
<ul>
<li>The IndieDAO aims to neutralize location-based compensation, replacing large gaps with more equitable payment terms</li>
<li>The IndieDAO aims to transition hourly work towards task based compensation over time, promoting specialization and rewarding efficiencies created by members</li>
</ul>
<h4><strong>Referrals</strong></h4>
<ul>
<li>Indies earn governance power and corresponding reputation when they invite others into the DAO</li>
<li>Indies earn governance power and reputation, and are compensated when they introduce additional project opportunities to IndieDAO</li>
</ul>
<h3>Fun 🎈</h3>
<h4><strong>Matching</strong></h4>
<ul>
<li>Upon growth milestones, Indies will be matched with projects that fit their specialized interests and skills</li>
<li>Upon growth milestones, Indies will be matched with other Indies with similar workflow preferences, interests, and business practices</li>
</ul>
<h4><strong>Gamification</strong></h4>
<ul>
<li>2C continues to build software that brightens up the boring parts of work, and brings joy to work deliverables</li>
<li>2C offers paid contracts to work on these projects, providing interesting work and contributing to stable deal flow</li>
</ul>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/600/1*yHozLyb2z1UO_E62BDh5Tw.gif"></figure><h3>What’s Next</h3>
<p>We are excited to continue this journey at 2C, transforming feedback from our partners into realizing our collective Indie dream. Please reach out to learn more or get involved, and follow us at <a href="https://twitter.com/twos_complement">2C on Twitter</a> and the <a href="https://twitter.com/theindiedao">IndieDAO on Twitter</a> to stay in the know.</p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=d4be725e4d9e" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/announcing-the-2c-indiedao-d4be725e4d9e">Announcing The 2C IndieDAO</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Announcing The 2C IndieDAO


<h4>🏆 2C won 1st place at ETHDenver 2021, allowing people to submit company and app reviews that cannot be censored by corporations.</h4>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*IA3l7PROsXQF3UPc2Cbsvg.jpeg"></figure><p>It’s ETHDenver 2021, and we tackled another project — pandemics can’t stop us from hacking! We decided to tackle a controversial topic in the tech space — reviews. We’ve been sitting on this summary for a few months, heads down launching our DAO, so we’re excited to share more about this project.</p>
<h3>The people of /WallStreetBets vs. Wall Street</h3>
<h4>The backstory</h4>
<p>On the morning of Jan. 28, Robinhood sent an email to its user base restricting stock purchases from several companies such as GameStop, AMC and Nokia, citing “market volatility” as the reason. The Reddit community <a href="https://www.reddit.com/r/wallstreetbets/"><strong>/WallStreetBets</strong></a> felt otherwise, that the move protected hedge funds and institutional investors, rather than the everyday person trading on the app.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/525/1*cP3kpZ1WnHXCcdRBoF6ayQ.png"></figure><p>In response, users took to Google and Apple to post negative reviews of the app, driving down it’s 5-star rating to a measly 1.1 star review. The fun didn’t stop there, either — <a href="https://www.tweaktown.com/news/77605/google-and-apple-remove-negative-reviews-of-robinhood-app-from-stores/index.html"><strong>Google and Apple came to the rescue</strong></a> by removing over 100,000 of these negative reviews, restoring Robinhood’s app store standing. The /WallStreetBets community demanded an explanation for why their voices were being silenced across the big tech companies. According to Gizmodo, Google claimed that it had taken “coordinated or inorganic reviews’’ down, but did not comment on how it defined an inorganic review.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/620/1*bGgzV-KDUyU7EPzxfn_gIw.png"></figure><p>The backlash continues, with calls to #DeleteRobinhood and a class-action lawsuit stating, “Robinhood’s actions were done purposely and knowingly to manipulate the market for the benefit of people and financial institutions who were not Robinhood’s customers.”</p>
<h4>Our take</h4>
<p>The online community has made it clear that <strong>people demand ownership of their voice and their data.</strong> We decided to build a blockchain-based review platform in response to this controversial event. What has transpired over the last month has revealed an opportunity for a blockchain-based solution to ensure that reviews belong to the people, not big tech companies.<br>We decided to therefore tackle the two sides of the problem of posting trust-worthy reviews: identity-verification and record-permanence.</p>
<h3>Decentralization for the win</h3>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/584/1*hefJvg84JRISLV3fUM2-ag.jpeg"></figure><h4>Reviews belong to the people, so let’s build it that way.</h4>
<p>🐶 True Review is a censorship-resistant review platform. It lets people own their reviews, and share them without fear of censorship. We believe that reviews are meant to support better decision-making and transparency, so long as you can prove that the reviewer is a real person.</p>
<h4>From identity, to storage, to gamification</h4>
<p>We thought through these sponsor integrations to come up with those that worked best to accomplish our goals for 🐶 True Review:</p>
<ul>
<li>People own their data by backing rich text/image/video reviews with <a href="https://idx.xyz/"><strong>IDX</strong></a> &amp; <a href="https://ceramic.network/"><strong>Ceramic</strong></a> (all stored on <a href="https://ipfs.io/"><strong>IPFS</strong></a> of course!)</li>
<li>Real companies are verified through local government APIs (also backed by IDX/Ceramic/IPFS)</li>
<li>People can verify their identity through Colorado’s <a href="https://mycolorado.state.co.us/">myColorado</a> app (or similar) for optional bot &amp; spam protection</li>
<li>People can link their reviews and identity to a decentralized namespace with <a href="https://unstoppabledomains.com/"><strong>Unstoppable Domains</strong></a>
</li>
<li>To make things fun and practical, why not add some gamification using <a href="https://near.org/"><strong>NEAR Protocol</strong></a> NFT rewards and prizes!?</li>
</ul>
<h4>The tech stack</h4>
<p>We were dazzled at ETHDenver last year with the maturity of ecosystem tools, and this year did not fail to impress us. We could not have stitched together a solution quite like True Review without these players.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*TxyqDzU8mt-9Vhm6irf48g.png"></figure><h3>Challenges</h3>
<p>One of the most challenging parts of the project was nailing down decentralized, user-owned data the right way. We considered 3 layers of decentralized data in the ecosystem:</p>
<ol>
<li>Base Layer (Blockchain/Ethereum/etc.) — storing data directly on a fully decentralized blockchain is the purest approach, but can be costly, slow, and difficult to scale</li>
<li>Middle Layer (Filecoin/etc.) — a mix of both worlds (1 &amp; 2), blockchain backed monetization powers a more trusted and permanent storage marketplace, much more scalable than directly on Ethereum, but still has atomic transaction costs</li>
<li>p2p Community (IPFS/Pinata/Ceramic/Textile/TheGraph/etc.) — a community driven ecosystem, mostly leveraging core IPFS technology to provide a network of peers that help store and share data in a more fluid nature</li>
</ol>
<p>Each layer has its pros and cons for specific use cases. For a review platform:</p>
<ul>
<li>People paying a cost in order to leave a review isn’t realistic</li>
<li>People want to interoperate with a variety of wallets, blockchain technology, and social identity verifications</li>
<li>People want to own their data, and decide where it is stored</li>
</ul>
<h3>The Presentation</h3>
<a href="https://medium.com/media/e88575eef68becb347998e4ac79be77d/href">https://medium.com/media/e88575eef68becb347998e4ac79be77d/href</a><h4>The team that made this happen:</h4>
<p><a href="https://twitter.com/nico_valencia">Nico Valencia</a>, <a href="https://twitter.com/katyjeremko">Katy Jeremko</a>, <a href="https://twitter.com/holachieri">Chieri Wada</a>, &amp; <a href="https://twitter.com/julesofjules">Julian Ramlal</a>.</p>
<h3>The Future of this Project</h3>
<p>Web2 solutions offer review systems today — we could start with partnering to provide the right APIs and blockchain-based solutions from the bounty sponsors and consult them on moving into web3.</p>
<p>We could also provide this solution by starting from scratch, funding the effort as a public goods solution backed by the ETH community, or by local governments.</p>
<h3>Awards</h3>
<p>Our hard work paid off with much appreciated community support for the project. At the end of the competition, 2C received over a dozen awards, including 1st Place Overall. Check out our submission on <a href="https://www.google.com/url?q=https://devfolio.co/submissions/blah-7859&amp;sa=D&amp;source=editors&amp;ust=1625263158104000&amp;usg=AOvVaw0iMKyepbeTAv3tHNsHf-qO"><strong>Devfolio</strong></a>.</p>
<ol>
<li><strong>1st Place Overall!</strong></li>
<li>Top 20 — Celebrity Judging Choice Award</li>
<li>8+ ColoradoJam Bounties</li>
<li>Ceramic Network</li>
<li>NEAR Protocol</li>
<li>IPFS</li>
<li>Unstoppable Domains</li>
</ol>
<p>Lastly, we were invited to the ETHDenver &amp; Colorado Government sponsored ColoradoJam incubator, and hope to continue working on this project in the future.</p>
<p>Huge thanks to the ETHDenver community for hosting one of the greatest hackathons in the world. We’re excited to return next year for more hacking!</p>
<p>If you’d like to play with True Review, 👉🏼 <a href="https://www.figma.com/proto/0eMGJeHltlcCKp4eTqdl5u/True-Review?page-id=162%3A225&amp;node-id=162%3A1521&amp;viewport=536%2C260%2C0.07466933131217957&amp;scaling=contain">view the design prototype here</a>.</p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=8e486bbf3cfb" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/true-review-censorship-resistant-reviews-8e486bbf3cfb">True Review: Censorship-resistant reviews</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


True Review: Censorship-resistant reviews


<h4>A closer look into how the team at Figma synthesizes feedback, prioritizes features, and executes releases.</h4>
<figure><img alt="Graphic illustration of a YouTube video mockup" src="https://cdn-images-1.medium.com/max/1024/1*ritoYd0_-XOSqReAL8ce1w.png"></figure><h3>Config goes virtual 💻</h3>
<p>For their second round, Figma took their conference on the road, both geographically and virtually! Big kudos to any attendees from the Western hemisphere that tuned in live 👏 But for sleep monsters like myself, we had the luxury of catching up on all the fun when Figma uploaded all of the talks, which you can view <a href="https://www.youtube.com/playlist?list=PLXDU_eVOJTx7kSHHiltBqo3FK__aB5HZi">here</a>.</p>
<p>I was fortunate to attend Figma’s inaugural conference held in San Francisco last February (can you believe it’s been a whole year???), which you can read about <a href="https://medium.com/twos-complement/config2020-4d4f60cb9344">here</a>. It was then CEO Dylan Fields announced updates to their latest shiny feature Auto Layout during his keynote speech. I had the same anticipation leading up to this event and to everyone’s delight, Figma signed, sealed, and delivered again this time with Variants, updates to Auto Layout, and more! 🎉</p>
<h3></h3>
<p>💠 Just announced at #ConfigEurope, and coming soon: Variants! Combine variations of the same component for different interactive states, colors, and sizes to mirror your front-end code and simplify your asset library. pic.twitter.com/eF9fBy7ejT</p>
<h3>Highlighting my favorite talks 🎤</h3>
<p>It was amazing to see how wide the variety of topics covered were. Some of my favorites include: <a href="https://youtu.be/5YeK72q2CRQ">gamification of ethical design</a>, <a href="https://youtu.be/cuhD3N5T_MQ">improving how we calculate accessibility</a>, and <a href="https://youtu.be/LcuwoNJAiCM">optimizing your week for healthy productivity</a>. But for me personally, one particularly special part about this conference was the insider look into the processes behind building features for Figma. With the launch of Variants, the BTS stories from the team at Figma revolved around how this highly sought after feature came to life.</p>
<h4>Mapping Features to User Problems 🔍</h4>
<p>by <a href="https://twitter.com/skuwamoto">Sho Kuwamoto </a>| Watch the full talk <a href="https://youtu.be/lcSKQS716WI">here</a></p>
<p>Products serving tens of thousands of customers inevitably receive a lot of pressure from their users. Nowadays, the pressure’s amplified due to the multiple avenues available to deliver your feedback: email, Twitter, YouTube, so on. So it’s no surprise how Sho and the team got the idea for Variants (previously called States):</p>
<blockquote><em>The reason we knew that States was important because [users] would say things like, “Please work on States,” or “I want States,” or… “For the love of god, work on States.”</em></blockquote>
<p>Gentle reminder that behind that screen, there’s a real human being on the receiving end 😅 As a user though, it is definitely exciting to hear that your feedback is being received. However, it does make you wonder how a team could possibly sift through the giant backlog. Sho reverse engineered their process at Figma and created the following outline:</p>
<ul>
<li>Listen to users for pain points</li>
<li>Identify solutions to user problems</li>
<li>Differentiate features as tactical or strategic</li>
<li>Map strategic features to see how they all fit together within the product</li>
<li>Synthesize and develop principles to guide your product development</li>
</ul>
<figure><img alt="Rough map of strategic features that group together user problems" src="https://cdn-images-1.medium.com/max/1024/1*rpWLNo9kVNMpCqgYnhepuA.png"><figcaption>Does anyone know how I can get to the corner of Design➡Code and Montgomery?</figcaption></figure><p>I particularly loved the step where he showed a visual map of how a jumbled list of user problems can become sorted into strategic features. In the beginning, the map may not line up well. But as the team moves forward with the process and identifies core principles, they figure out how features fit together and the map straightens out.</p>
<p>This process was interesting to me as it requires an immense amount of trust between both parties. The product development team has to trust their users’ feedback and figuring out how to solve them is what pushes the product forward. Similarly, users have to trust the team to figure out what it is they really want, even though it may be articulated differently. This was clear when States evolved into Variants! The resulting principles are what will continue to nurture this trust.</p>
<figure><img alt="List of principles that the Figma team developed as they synthesized user problems to potential features" src="https://cdn-images-1.medium.com/max/1024/1*a7NvbAd3xcHsfcHEOMdP3g.png"></figure><h4>Fail Hard, Fail Forward — In the Open 😳</h4>
<p>by <a href="https://twitter.com/kelseymwhelan?s=20">Kelsey Whelan</a> &amp; <a href="https://twitter.com/nikolasklein?s=20">Nikolas Klein</a> | Watch the full talk <a href="https://youtu.be/8ETLYF7R7j0">here</a></p>
<p>From conception to execution, Variants went through cycles on cycles of iteration. Although the team had reached a pretty clear understanding of the end goal, the trick was in visually executing how users conceptually understood this feature. As many of us who work in product understand, there’s no better way to reach your goal than through user testing. This process tends to shatter a lot of internal assumptions and enlighten us of real-world use cases.</p>
<figure><img alt="User quote that reads, “I think what’s tripping me up is that it’s called States but it does so much more than that.”" src="https://cdn-images-1.medium.com/max/1024/1*0Og2tMCy9vmU3RO_dL9JgQ.png"><figcaption>Kelsey and Nikolas credit their users for guiding them to the final name, “Variants” 🎉</figcaption></figure><p>Although remote user testing was not new to Figma, something different they implemented during the pandemic was opening up the testing sessions with the rest of the company. Members from other teams joined in and were able to directly hear the feedback from their users. Not only were they listening in, but everyone started commentating live in a Slack channel, going rogue against all Slack etiquette!</p>
<figure><img alt="Kelsey and Nikolas share snippets from their user interviews live feedback discussion in Slack" src="https://cdn-images-1.medium.com/max/1024/1*850DcVrUAaGKSUGrPDBieg.png"><figcaption>Ah yes, user feedback — necessary for success but sometimes a blow to the soul</figcaption></figure><p>This display of transparency and vulnerability from the team ultimately developed and encouraged a culture of failing together in the open. During a time of global hardship through this pandemic, opening up your workflow to include anyone and everyone created a more intimate sense of community within the company. Not only did it bring teammates closer, but it also gave permission to everyone else to unapologetically fail and fail forward.</p>
<figure><img alt="Slide that reads, “When everyone is allowed to fail, anyone can contribute bold ideas.”" src="https://cdn-images-1.medium.com/max/1024/1*Ltir9PFtZuW5ZQ4n9PHHIw.png"><figcaption>My favorite takeaway 💖</figcaption></figure><h4>Flexing Closer to Flexbox 📐</h4>
<p>by <a href="https://twitter.com/eymlin?s=20">Emily Lin</a> &amp; <a href="https://twitter.com/willyvvu?s=20">William Wu</a> | Watch the full video <a href="https://youtu.be/8Q5uBR52G2Q">here</a></p>
<p>Who else has spent a lot of time calculating individual heights/widths of Auto Layout frames to fill their Auto Layout parent containers? 🙋 Since Auto Layout V1 first launched in late 2019, its functionality was already improved with V2 when its ability expanded from just “hug contents” to also include “stretch” in the counter axis. Although that worked in silo for simple components, when combined together to make complex components, frames needed to expand in both main and counter axes.</p>
<p>The team immediately recognized this and intended to launch a fast follow February of this year. However, what was thought to be an easy solution ended up being an oversimplified band-aid over a larger problem. Through digesting both internal and external feedback, more functionality gaps were identified. This ultimately led the team to launch a proper V3.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*ywmdob1745MySyBjfrBhVg.png"></figure><p>The iterative process of how they ultimately solved for Alignment and Resizing was enlightening and I highly recommend you to watch the full talk to go along for that ride. What stood out to me most, however, is their decision to completely rethink their solution. A fast follow release may have solved some user problems but not all. Moreover, another important goal for V3 became <strong>future proofing </strong>Auto Layout. In the same spirit of failing forward, we often have to fail fast. This inevitably leads to <a href="https://hackernoon.com/there-are-3-main-types-of-technical-debt-heres-how-to-manage-them-4a3328a4c50c">tech debt</a> — which isn’t a bad thing! But it does require identifying when to take a step back to tackle it.</p>
<p>I wholeheartedly applause the effort from this team because it was absolutely a more satisfying update! Although there was some learning to do with the new Alignment and Resizing panels, it was so worth it because it ultimately made Figma a much more powerful design tool.</p>
<p>I hope you enjoyed the insider look into what goes on behind the scenes at Figma just as much as I did! Did you also watch the conference? Let me know which talks you liked the most️! ❤️ 💜 💙 💚</p>
<h3>Bonus Highlighted Talk ✨</h3>
<h4>Color 🌈 = Math 🧮</h4>
<p>by <a href="https://twitter.com/gusso?s=20">Henrique Gusso</a> | Watch the full talk <a href="https://youtu.be/cuhD3N5T_MQ">here</a></p>
<figure><img alt="Henrique Gusso presenting his talk; Slide shows the word “Math” over a rainbow" src="https://cdn-images-1.medium.com/max/1024/1*4XAri_hSv5foUm8uin8KSg.png"></figure><p>Although Henrique’s a designer at TransferWise, I had to include his talk on unpacking how accessibility is currently calculated, why it’s flawed, and his mission to discover a better alternative. I believe all designers should be accounting for accessibility, but I am guilty of blindly accepting what [insert your favorite accessibility plugin here] tells me. This talk reminded me to challenge those conceptions and accept that product design is a living, evolving thing that isn’t perfect. It’s up to us, the makers, to responsibly get it there.</p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=eb9b361016d" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/config-europe-designing-a-design-tool-eb9b361016d">Config Europe: Designing a design tool</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Config Europe: Designing a design tool


<h3>Remote Teams: 6 Crucial Tools for Success</h3>
<h4>Sail into high team performance with these remote-friendly tools</h4>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*VLkauwKLJo-eumAS1xBQgQ.png"></figure><h4>In 1965, Bruce Tuckman created the <a href="https://en.wikipedia.org/wiki/Tuckman%27s_stages_of_group_development">5 stages of team development</a>:</h4>
<ol>
<li>Forming</li>
<li>Storming</li>
<li>Norming</li>
<li>Performing</li>
<li>Adjourning</li>
</ol>
<p>All teams transition through these stages to reach optimal performance, whether they realize it or not — but some have it easier than others. For both remote and co-located teams, issues arise as they move through these stages. However, co-located ones have a distinct advantage: they create relationships quickly and are able to have water-cooler conversations to tackle issues. Remote teams, on the other hand, need extra care and guidance to maneuver through their work gracefully. We’ve found that we can reduce hangups and blaze into the Performing stage in no time, using these 6 Crucial Remote Tools.</p>
<h3><strong>Crucial Remote Tool: #1 Working Agreements</strong></h3>
<p>We enter the Forming stage: our team is meeting for the first time. Everyone is on their best behavior and getting the lay of the land. You might be asking — who are my team members? What are their roles? What is our project scope and timeline? Without the luxury of being in a room together, answering these questions is more complicated. We suddenly have the perfect opportunity to implement ground rules.</p>
<p>Enter <strong>working agreements</strong>!<strong> </strong>With working agreements, we can break down barriers, and determine how we want to work together, as a team.</p>
<h4>Working agreements include items such as:</h4>
<ul>
<li>Ideal times to meet</li>
<li>Using video on calls</li>
<li>Penalties for showing up late to meetings (think singing a song or a dollar into the virtual coffee jar) — make it fun for your team to choose their own</li>
<li>Asking how team members communicate best</li>
</ul>
<p>By setting agreements early on and getting team buy-in, we reduce confusion and assumptions. Team members will know what to expect of others and determine the best ways to communicate, especially when overlapping time is limited.</p>
<h3><strong>Crucial Remote Tool: #2 Project Workflow</strong></h3>
<p>Our second crucial remote tool is creating a <strong>project workflow</strong>. We enhance our daily communication by creating a common understanding of how work progresses through our project management tool(s).</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*avSj5xfF8v7wCaX_7yY1pQ.png"></figure><p>As work begins you might find yourself wondering — When is this work considered done? Does my teammate know this is ready for him? What is my teammate working on today? Clearly stated workflows reduce assumptions, clearly communicate status, and allow team members to run with things while those on the other side of the globe are sleeping.</p>
<h3><strong>Crucial Remote Tool: #3 Creating Space for Conversation</strong></h3>
<p>Congrats! We’ve now come charging into the Storming stage. Pleasantries and excitement of a new project have faded. Those fun teammates might be annoying now. The weight of a deadline might be looming. Digging into the work means that conflict is sure to arise, and we must be prepared with a safe culture that allows for differing opinions to arrive at the best outcomes.</p>
<p>We need to be armed for the inevitability of conflict by <strong>creating spaces for conversation </strong>to ensure we fuel a healthy culture.<strong> </strong>By creating space, we allow for conflict or tension to release itself. The team has the opportunity to voice concerns and have them addressed.</p>
<h4>Try creating these spaces for conversation:</h4>
<ul>
<li>Find time for work refinement allows the team to discuss plans of attack — how and when to tackle work before it has even begun.</li>
<li>Create space for team members to review each other’s work and provide each other with feedback. This helps to surface concerns on finished work before it’s delivered to a client.</li>
<li>Have cadenced retrospective time to support team members to anonymously give feedback on the project through its lifecycle. The team can also make suggestions for improvements to try in the future.</li>
</ul>
<blockquote>We need to be armed for the inevitability of conflict by creating spaces for conversation to ensure we fuel a healthy culture.</blockquote>
<h3><strong>Crucial Remote Tool: #4 Making the Most of Your Face-to-Face Time</strong></h3>
<p>We’ve hit our groove: we have made it to the Norming stage. Here team members are noticing who the experts are and appreciating what others bring to the table. In Remote work, we are limited in our <strong>face-to-face time</strong>, so we better be sure to make the most of it!</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*JL7Mk-GZTdu6HisO9-iILg.png"></figure><p>How do we optimize meeting times? Let’s utilize our working agreements from earlier by creating stable meeting times with consequences for latecomers. Ideally, we keep consistent meeting times to allow everyone to come prepared and ready for active engagement. We ensure these sessions have agendas and review them regularly. Can topics be discussed more in-depth asynchronously? We get critical about sidebars to make sure the important topics are discussed first.</p>
<p>Try breaking the ice… every time. With a remote team, it is helpful to take the first 5 or 10 minutes of a weekly meeting to continue building trust with icebreakers. Whether a clean version of Never Have I Ever, a question of the day, or a weekend recap, these seemingly silly tasks can help everyone feel more connected and willing to reach out when they need help.</p>
<p>If you’re using Agile methodologies on your product/engineering teams, try <a href="http://tastycupcakes.org/">tastycupcakes.org</a> for some fun and engaging games.</p>
<h3><strong>Crucial Remote Tool: #5 Asynchronous Communication</strong></h3>
<p>Finally, we reach the Performing stage! We are in the flow and making significant progress towards our goal. It is time to optimize ourselves. Let’s make sure we utilize <strong>asynchronous communication </strong>to the fullest.</p>
<p>Asynchronous communication means coming in and out of the conversation on your own time. Jump into important topics when they come up and extricate ourselves — reducing noise — of those that we aren’t critical to.</p>
<h4>Here are ways to take async communication to the next level:</h4>
<ul>
<li>Try chat or text-based check-ins (or standups) to let others know what you are working on throughout the day, in lieu of an actual meeting. Call out anything that might block progress. This allows anyone on the team to get support.</li>
<li>Use threads in communication tools (instead of DMs), so that others can clue into topics and engage when necessary.</li>
<li>Post summary notes from meetings with outcomes at the top, to give people information when they are unable to attend sessions.</li>
</ul>
<h3><strong>Crucial Remote Tool: #6 The Exit Survey</strong></h3>
<p>The end of our project has arrived. Tuckman added the final stage, Adjourning, a few years after his initial 4 stages, because it is important to remember there is something for us to learn, even at the end of a project. The team has gotten to know and appreciate each other’s skillsets, reduced conflict, increased trust, and (hopefully!) delivered. This is an ideal time to learn from the successes and failures of our future projects through an<strong> exit survey.</strong></p>
<h4>Use an online survey tool with 5–10 questions, such as:</h4>
<ul>
<li>What was the most successful part of this project?</li>
<li>If you could change one thing about the project what would it be?</li>
<li>Were you comfortable talking with your teammates or managers?</li>
<li>Did you have clear goals and objectives?</li>
</ul>
<p>This allows managers to get quick information on how to improve teams for even greater success next time.</p>
<p>We’ve covered how teams progress, and how these stages can be more challenging for remote teams. Using these 6 crucial remote tools, your team will be equipped to handle whatever is thrown your way, and achieve ultimate remote success.</p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=841743b37865" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/6-crucial-tools-for-remote-team-success-841743b37865">6 Crucial Tools for Remote Team Success</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


6 Crucial Tools for Remote Team Success


<h3>Figma’s First Conference — Config 2020</h3>
<p><em>Note: It feels really strange to write about an event that feels so far removed from the global health pandemic we’re experiencing now… I debated whether it was still okay to publish this article, but I reflected back on how I felt at the conference: welcomed, creative, and part of a larger, warm community. And I realized we could use a little more of that, especially now. So I hope this article brings some delight and can transport you back to a time when we were enjoying each other’s company and geeking out over our favorite design tool. Stay safe.</em></p>
<figure><img alt="Entrance to Config 2020 taken at night" src="https://cdn-images-1.medium.com/max/1024/1*xQaVa5jOIlR_jfIvwktF0w.jpeg"><figcaption>A nighttime view of Config 2020 — Check out those colors! 😍</figcaption></figure><h3>A life-changing experience: Figma IRL 🎉</h3>
<p>When Config 2020 was first announced, I can’t tell you how stoked I was. Not only would it be my first design conference, it’s hosted by my favorite design tool! Figma being built for the browser, I have always felt that they were internet-first:</p>
<ul>
<li>Figma’s Designer Advocates writing best practices, actively participating in Twitter discussions, and recently, hosting livestreams</li>
<li>Introducing <a href="https://www.figma.com/blog/introducing-figma-plugins/">Plugins</a> which allowed creators everywhere to build upon Figma</li>
<li>Introducing <a href="https://www.figma.com/blog/introducing-figma-community/">Figma Community</a> that further champions the idea of open-source design, effectively becoming the design counterpart to Github</li>
<li>Amplifying creators that use Figma in ways that even exceeds CEO Dylan Field’s expectations (Like <a href="https://twitter.com/zoink/status/1205544389528834048">literally creating music</a>… What?!)</li>
</ul>
<p>With such a strong online presence, I was excited to see what kind of in-person experience they would come up with.</p>
<p><strong>SPOILER ALERT: </strong>It was freakin’ awesome.</p>
<h4>And the crowd goes wild</h4>
<p>The conference started with Figma CEO, Dylan Fields, presenting a collection of <a href="https://www.figma.com/blog/config-2020-new-feature-announcements/">new features</a> they released (<em>psst…</em> Figma just made Selection Color <a href="https://twitter.com/figmadesign/status/1247190463599108096">even better</a>). When he announced that Stretch will be added to Auto Layout, I was ecstatic and people <em>cheered </em>(It’s me, I’m people). It was as if the new iPhone was just announced at Apple’s WWDC! But the release was such a thrill because it was proof of Figma’s dedication to user feedback. I was so happy because I <em>wanted </em>these features, and they listened! 🎉</p>
<h3>Highlighting my favorite talks 🎤</h3>
<p>The rest of the day was filled with keynote speeches, talks, and workshops but I want to highlight two talks in particular. Although they’re not directly related to Figma as a design tool, they truly made an impression on me as a designer and creator. If you’re feeling up for some creative inspiration, I <em>highly </em>recommend watching the full videos. Find the complete list of recordings from Config <a href="https://www.youtube.com/playlist?list=PLXDU_eVOJTx4UHprj9iYPBu4agz8HiB66">here</a>.</p>
<h4>Adding Scaffolding to Collaboration for Deep Work</h4>
<p>by Craig Mod | <a href="https://craigmod.com/">Website</a> | Watch the full talk <a href="https://youtu.be/WrAxvpvfB2w">here</a></p>
<figure><img alt="Craig Mod, writer and walker, on stage" src="https://cdn-images-1.medium.com/max/1024/1*U_bwXisIR0-QPDChCg8ELA.jpeg"><figcaption>Craig Mod, writer and walker based in Japan</figcaption></figure><p>We are living in a hyper digital age and we, as designers and developers, are fully immersed in it. So much that it’s dangerously easy to get lost in the massive amount of work we are constantly pumping out. As Craig pointed out, a folder with one item and a folder with a billion looks and feels exactly the same. To combat this, Craig’s personal form of therapy is to create books or, in other words, turning the digital into physical.</p>
<figure><img alt="Two folders on a desktop: One with one file, another with one billion files, but both look exactly the same" src="https://cdn-images-1.medium.com/max/800/1*pt7trDwmwBWfQU5Z4RMakA.gif"><figcaption>Folder with one vs. Folder with a billion — What feels different?</figcaption></figure><p>He shared the story from his time building <a href="https://about.flipboard.com/">Flipboard</a> for iPhone in 2011. As it often goes in Silicon Valley, startup teams work tirelessly to launch 1.0 of their idea and then, after a quick celebration, it’s back on the grind to 1.1 or even 2.0. Our digital products make it difficult to capture the totality of effort and collaboration required to arrive there. To gain perspective, Craig extracted the process out of its digital realm into a tangible object you can feel: a 276-page, 1-foot-by-1-foot, 8lb monolith of a book that displayed every single design iteration and every single commit that the team pushed. This book documenting the journey to the first Flipboard for iPhone effectively became a physical relic that can never be overwritten.</p>
<p>My awesome team of indies at <a href="http://twoscomplement.io/">Two’s Complement</a> is currently running at full speed to launch a client’s product and designing it in Figma has been a game changer for our remote collaboration. But I realized that one of Figma’s strongest features — the ability to always work in the latest version — could exacerbate this type of exhaustion caused by the ephemeral nature of technology. We don’t even have lists of files similarly named MasterDesign_v16_Final.sketch to call attention to every design iteration we endured. Though I probably won’t print a 300-pager, Craig’s talk reminded me to take some time to dig through our 💀 Graveyard page and relish in the history of our designs. Every update to the iconography, new menu design, revised flow — <em>we made that. </em>And that’s something to be damn proud of.</p>
<h4>Joyfully Subverting the Status Quo</h4>
<p>by May-Li Khoe | <a href="http://www.maylikhoe.com/">Website</a> | Watch the full talk <a href="https://youtu.be/Aalyplbv5Mo">here</a></p>
<figure><img alt="May-Li Khoe, creative freelancer, on stage" src="https://cdn-images-1.medium.com/max/1024/1*RyzW2b4FkzpyXOtcvdmbBw.jpeg"><figcaption>May-Li on stage, highlighting the Black Panthers’ free breakfasts for kids program | Credit: <a href="https://twitter.com/justincalles/status/1225594766286438402">Justin Calles</a></figcaption></figure><p>How often do we hear that life is a series of accomplishments that we should check off: graduate, get a job, marriage, promotion, and so on. I don’t deny that this is a great life — I’m eager to achieve these things as well! However, May-Li encouraged us to courageously take actions against the status quo. Because <em>that</em> is when the community comes together in the most beautiful ways.</p>
<p>My favorite story shared was of an incident from 2018: a white woman, unaffectionately named “BBQ Becky”, called the police on two black men barbecuing at Lake Merritt in Oakland. This news story sparked a nationwide conversation about the ongoing racial injustice in America. May-Li mentions that people could have chosen to react in anger, and rightfully so. However, Logan McWilliams and Jhamel Robinson instead organized <a href="https://z-m-www.facebook.com/events/441368776644995/">BBQ’n While Black</a>, a creative protest that brings thousands of families back to Lake Merritt to celebrate black culture.</p>
<figure><img alt="Scraper drives by crowd at Lake Merrit during creative protest, BBQ’n While Black" src="https://cdn-images-1.medium.com/max/1024/1*xvy7_QOrEPGIr5X8Z0j5UA.jpeg"><figcaption>“Sitting in my scraper, watching Oakland Gone Wild, ta-dow” — E-40 | Credit: <a href="https://www.kqed.org/arts/13832886/were-still-here-bbqn-while-black-draws-out-oaklanders-in-force">Kevin Allen</a></figcaption></figure><p>Logan explains, “This whole thing was birthed out of my discomfort with my comfort. How things have become so normalized…So when the BBQ Becky situation happened, I almost was a little numb. And I was uncomfortable with that feeling.” (<a href="https://www.berkeleyside.com/2019/07/22/oakland-comes-out-to-celebrate-bbqn-while-black">Source</a>) In the face of deep-rooted racial adversity, she chose to make some friends, start some shit, and joyfully subvert the status quo.</p>
<h3>Socially distant designing</h3>
<p>Fast forward to now, in this strange time we find ourselves in. I am extremely fortunate and privileged to be in a place of security right now, but I still face a lot of anxiety. Being a part of a remote agency, I thought I would be used to working from home and yet this all feels different. Whatever anxieties you may be feeling, please know that you’re not alone.</p>
<figure><img alt="Child lifelessly hanging on to a merry-go-round and being (safely) dragged around the floor" src="https://cdn-images-1.medium.com/max/508/1*eukI9YphVdsNs-hcVboPFA.gif"><figcaption>It really do be like that…</figcaption></figure><p>But what I love about the design community is that we are natural problem solvers. Just like many of us are building adorable islands in Animal Crossing, we’ve also invented creative ways to hang out digitally! A key player to all this is Figma’s multiplayer capabilities. The feature that’s saved my work life for collaborating with my teammates in Colorado, Spain, and Costa Rica is now saving my <em>personal </em>life for social distance playing!</p>
<p>Here are some of my favorites from the community:</p>
<h4>WFH Town</h4>
<h3>𝐟𝐢𝐨𝐧𝐚 on Twitter</h3>
<p>so since everyone is wfh.... anyone want to build a town in Figma and hangout Online???</p>
<p>I’ll answer that for you: Yes, people definitely wanted to build a town and <em>it was wild. </em>Check out the beautiful mayhem that ensued <a href="https://www.figma.com/file/oWROUvWBzK8B8BfvOWF8My/WFH-Town?node-id=0%3A1">here</a>.</p>
<h4>Drawing together</h4>
<h3>Amanda Yee on Twitter</h3>
<p>On Thursdays, the @Drift design team does a quick activity and works in a shared space for a bit. But now we're all WFH.. So today we hopped on @zoom_us and drew some of our fav logos from memory in @figmadesign.</p>
<p>I love that this team was able to continue their weekly tradition while at home! I feel like having a gang of people draw together in Figma encourages some really fun, chaotic energy that you may not get in an in-person meeting… Perfect 😈</p>
<h4>Chatting in Figma</h4>
<h3>Miguel Cardona-Professor at a Distance 🧱RIT 🐯 on Twitter</h3>
<p>The components are even better when you have someone else in @figmadesign to chat with. https://t.co/UmJ29NcH0n</p>
<p>I have been loving Miguel’s work that he’s doing since teaching from home! He’s come up with a number of creative ways to engage with his students using Figma, like <a href="https://twitter.com/miggi/status/1242824732950618112">taking attendance</a> and chatting in file.</p>
<h4>Blokma: A strategy game</h4>
<h3>Chieri Wada on Twitter</h3>
<p>Here's a peek at how our test run went! Doodling not required but strongly recommended 😂 Also, I was playing with 3 new @figmadesign users! Really happy with how fast everyone picked up using the tool ✨</p>
<p>Inspired by the design community, I recreated one of my favorite strategy board games, Blokus! I’ve been playing with friends who have never used Figma before and am always impressed with how quickly everyone learns the ropes. It also doesn’t take long until we’re doodling all over the board 😂 Duplicate the file <a href="https://www.figma.com/community/file/829983150233147338/Blokma">here</a> and play with your friends!</p>
<p>And that’s it! I hope you were able to take something away from this and maybe schedule a night to play on Figma with your friends or family 🙌 Stay safe, everyone. We’ll get through this together.</p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=4d4f60cb9344" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/config2020-4d4f60cb9344">Figma’s First Conference — Config2020</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Figma’s First Conference — Config2020


<h3><strong>Secure myState — Government Services for Citizens #ETHDenver2020</strong></h3>
<h4>A blockchain toolkit for governments to interface with residents</h4>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*rIuwlXbfCrG5sA4hlGCHyw.jpeg"><figcaption>We woke up like ‘dis. Just kidding, this was after we pulled an all-nighter.</figcaption></figure><h4>TL;DR:</h4>
<p>A team of our 2C Indies gathered last weekend to design and hack at <a href="https://www.ethdenver.com/">ETHDenver 2020</a>. We arrived, seeking the latest in blockchain, collaborations, and ideas to build on. We came out of the event with a very practical and ease-of-use experience for citizens to leverage Colorado’s State services — but we didn’t stop there — we think other governments could benefit from this too.</p>
<h3>The State of Dapps 2020</h3>
<p>The ETH community has continued to blossom, especially since our check-in at ETHBerlin last fall. Third party tools like <a href="https://fortmatic.com/">Fortmatic</a>, <a href="https://3box.io/">3Box</a>, <a href="https://pinata.cloud/">Pinata</a>, etc. are mature enough for drop-in integration with existing web apps.</p>
<p>We’re continuing to find that <em>mass aDapption</em> cannot be reached without the right user experience — connecting the value of blockchain tech to practical use-cases, in a way that normal users can engage with.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/481/1*sG-OBXNMuEef7WTvwwBJRg.jpeg"></figure><h3>What is Secure myState?</h3>
<p>We met representatives of <a href="http://www.oit.state.co.us/">Colorado Governor’s Office of Information Technology</a>, Russell and Thad, and dove into areas that the State of Colorado is exploring. Who better to lead out on blockchain use cases than our government?</p>
<p>The primary challenges covered: secure document signing &amp; uploading, user-to-user &amp; user-to-state messaging, and future integration with Colorado’s digital identity within the <a href="https://mycolorado.state.co.us/">myColorado</a> app. We decided to tackle these challenges in one, seamless application ecosystem.</p>
<p><a href="https://www.youtube.com/watch?v=du4KIvzcVSY&amp;feature=youtu.be"><strong>Demo</strong></a> | <a href="https://www.figma.com/proto/usEzmsRYQCe3MP8qp4ur5H/Advance-Colorado?node-id=76%3A5609&amp;viewport=143%2C-89%2C0.049727652221918106&amp;scaling=scale-down"><strong>Figma</strong></a> | <a href="https://github.com/twos-complement/eth-denver-2020"><strong>Github</strong></a></p>
<h4>So, what is it?</h4>
<p>It’s a self-guided, educational user experience.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/926/1*2iBKywfmymDh7XwHwQrs-w.gif"></figure><p>It’s a place where you can operate as a citizen, or a business entity.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/926/1*Djcrn00KEXVpA2cvOodfiQ.gif"></figure><p>It’s a document upload &amp; verification system.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/926/1*3br9ZRJXJ2TbPbnsWp4QyQ.gif"></figure><p>It’s an occupational license repository.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/926/1*plgW0MgDJdDogWIERo2kpA.gif"></figure><p>It’s a user-to-user &amp; user-to-state messaging service.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/926/1*endk7MJIQiKcg9zWKsNn_w.gif"></figure><p>It’s a one-stop-shop, for the people, by the people.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/926/1*hpnLw0Tpa-sgz_KbGT_QCg.gif"></figure><p>Instead of proposing new tools, Secure myState combines and implements existing blockchain integrations with a mindset of making government services easily accessible for everyone.</p>
<h3><strong>Product strategy</strong></h3>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/500/1*MqSaM1dqP8Cg3CXB8k-n0w.jpeg"></figure><h4>Get my job done</h4>
<p>User experience of Dapps today can break down from early stages of use (account creation, &amp; identity verification), all the way to completion flows (signing transactions, authentication, etc). Woah, say what? That’s a lot of blockchain-jargon and I just need to get something simple finished.</p>
<p>We used the jobs-to-be-done framework and built a revised information architecture around what the user needs (not what the cool new hotness technology is doing behind the curtain).</p>
<h4>Provide me updates</h4>
<p>We used motion and animation at key points within our Prototypes to communicate what the system was working on under the hood.</p>
<h3>Tech stack</h3>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*KSYYueZjXEuuAPG-"></figure><p>Our experience this year working with integrations is amazing. Last year, many of these tools were still in their infancy, and it was impressive to see how far everything has come. We could not have built Secure myState in a weekend, without each of these integrations solving a piece of the puzzle so well.</p>
<h4>Our Stats</h4>
<ul>
<li>4 people: 2 <a href="http://www.twoscomplement.io/">design and developer duos</a>
</li>
<li>23 hours 43 minutes of non-stop hacking</li>
<li>2 hours and 36 minutes of sleep combined</li>
<li>44,032 lines of code (including vendor)</li>
<li>382 stickers collected</li>
<li>$128 of <a href="https://buffidao.com/">Buffidao</a> spent [mostly] on food trucks</li>
</ul>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*Cygh9N6KXRJLPfnFs-Lx-Q.jpeg"></figure><h3>Where we see this project going</h3>
<h4><strong>At the State-Level</strong></h4>
<ol>
<li>
<strong>Accessible Services. </strong>We believe there is an opportunity for people to feel connected to State services by focusing on improvements to it’s digital user experience. This could further improve citizen engagement and create administrative efficiencies.</li>
<li>
<strong>ID-authenticated transactions. </strong>The myColorado app now offers a permissible digital driver’s license, thanks to Jared Polis’s Information Technology team. We could take this one step further: Identity documents (such as ID cards, citizen cards, driving licenses, passports, etc.) could be used to sign transactions or legal documents in conjunction with State verifications.</li>
</ol>
<h4><strong>At the National Level</strong></h4>
<ol>
<li>
<strong>Sharing Data between States.</strong> Just like people can interoperate between States, their data should be interoperable between municipalities and government institutions.</li>
<li>
<strong>Leading out. </strong>Does it make sense for private, for-profit companies to codify the ways that blockchain and data-encryption work?… Wouldn’t it be better for the government to set high-level frameworks and provide examples of meaningful impact?</li>
</ol>
<h3>Bounties we won</h3>
<h4>🏆 State of Colorado Use Cases</h4>
<p>Learning about the vision and needs of their department was inspiring, and we had a blast working on this project. Thank you Russell, Thad, and everyone else involved for posting this bounty and bringing innovation to Colorado in general. 2C is proud to be headquartered in Boulder!</p>
<h4>🏆 Best Project With Fortmatic Integration</h4>
<p><a href="https://fortmatic.com/">Fortmatic</a> enables users access to Ethereum apps from anywhere. No browser extensions or seed phrases needed. This was perfect for our use case, because we wanted to create a user experience that anyone could use.</p>
<p><strong>What we love about Fortmatic:</strong></p>
<ol>
<li>Sign-up — Account creation feels like a normal app, but is still backed by <a href="https://medium.com/fortmatic/security-infrastructure-at-fortmatic-4a95c3688997">secure flows</a> that allow integration into any dapp.</li>
<li>Signing Transactions — Users can easily sign messages that verify their ownership of data.</li>
<li>Whitelabeling — Integrating Fortmatic was simple, and their recently announced whitelabeling is be perfect for Secure myState, should it be offered to various states or government bodies.</li>
</ol>
<h4>🏆 Best Overall 3Box Integration</h4>
<p><a href="https://3box.io/">3Box</a> makes it simple to store data securely with users, letting you focus on building great products. 3Box served as our primary user profile, application database, and messaging provider. We first met the 3Box team while helping organize ETHBerlin 2019, and have been excited to catch up on their latest features.</p>
<p><strong>What we love about 3Box:</strong></p>
<ol>
<li>
<strong>Auth.</strong> Linking Fortmatic auth to a 3Box profile is seamless, as they support many web3 providers “out of the box” 😅</li>
<li>
<strong>React Componentry.</strong> The 3Box React components allow us to quickly and easily show users their profile in-app</li>
<li>
<strong>Spaces functionality. </strong>Spaces allow us to track a list of documents users upload to IPFS</li>
<li>
<strong>Threads functionality.</strong> The *new* threads feature provided an excellent set of messaging functionality for chat and state message broadcasting.</li>
</ol>
<h4>🏆 Best Use of a Project from <a href="https://awesome.ipfs.io/">awesome.ipfs.io</a>
</h4>
<p>The <a href="https://ipfs.io/">IPFS</a> community has been close to our hearts for many years now. We leveraged IPFS back in 2015 to prototype a local design file sharing app, and have been tracking along with the community ever since. We built <a href="https://medium.com/twos-complement/ipfs-stash-local-ipfs-for-everyone-ethdenver2019-b5b45ae0d5c9">IPFS Stash at ETHDenver 2019</a>, where we met and received guidance from the super-amazing <a href="https://pinata.cloud/">Pinata</a> and <a href="https://textile.io/">Textile</a> folks.</p>
<p><strong>What we love about IPFS:</strong></p>
<ol>
<li>
<strong>Storage. </strong>We’re looking forward to a production level marketplace with <a href="https://filecoin.io/">Filecoin</a>
</li>
<li>
<strong>Ecosystem partnerships. </strong>We’d love to integrate Textile into a future project, as well as a handful of other projects in the group!</li>
</ol>
<p>Thanks again for posting this bounty, and thanks to <a href="https://protocol.ai/">Protocol Labs</a> for reflecting your commitment to this community.</p>
<h4>🏆 Simplify Your Immutable Data with the Pinata API and Toolkit</h4>
<p>Kyle and Matt at <a href="https://pinata.cloud/">Pinata</a> are some of the kindest, most intelligent folks we’ve met in the blockchain community.</p>
<p><strong>What we love about Pinata:</strong></p>
<ol>
<li>
<strong>Passion. </strong>Their passion for supporting the core ecosystem is huge, and it shows in their work.</li>
<li>
<strong>Ease-of-Use. </strong>Pinata made it super easy to post various file types to IPFS, and it will auto-pin up to 1GB for free (at the time of writing this article).</li>
<li>
<strong>Marketplace Support. </strong>Especially with the current lack of IPFS marketplace support, Pinata was an integral part of us getting things going this weekend.</li>
</ol>
<p>Thanks again, Pinata, for continuing to show-up and share your wisdom.</p>
<h3>Other Bounties We Aimed For:</h3>
<h4>The UX Awards! (Pepo)</h4>
<p>Our team really enjoyed using <a href="https://pepo.com/">Pepo</a> over the weekend, and were inspired to see a quality user experience built completely on web3 tech. Keep up the great work Pepo!</p>
<p><strong>What we love about Pepo:</strong></p>
<ol>
<li>
<strong>Cool-factor.</strong> Pepo is leading the way here, so we tried to put our best foot forward on user experience design with Secure myState.</li>
<li>
<strong>Demonstration of a Use-Case.</strong> If you think Pepo is cool, try building something with <a href="https://ost.com/">OST</a>. We are in early stages of implementing OST into an internal product at Two’s Complement, and can’t wait to see how things continue to progress.</li>
</ol>
<h4>Best Use of 3Box Storage</h4>
<p>We used <a href="https://3box.io/">3Box</a> Storage for our application state. Documents are uploaded to IPFS, then signed by users. This signed IPFS record is then validated then signed by the state, and published to the blockchain for chronological record permanence.</p>
<h4>Best use of a 3Box plugin</h4>
<p>We leveraged the prebuilt Profile React plugin from <a href="https://3box.io/">3Box</a>. This saved us many hours of work during the hackathon, and it had additional customizations we didn’t get the time to checkout. Nice work 3Box!</p>
<h4>Most Social Application (3Box)</h4>
<p>Since our application allowed the state office to message every citizen using broadcast notifications with the <a href="https://3box.io/">3Box</a> threads API, we figured this counts as social. Threads are fairly new, and added a ton of great messaging functionality “out of the box”.</p>
<p>Thanks everyone for another great year. We’ll look forward to the next!</p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=17f47407b656" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/secure-mystate-government-services-for-citizens-ethdenver2020-17f47407b656">Secure myState — Government Services for Citizens #ETHDenver2020</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Secure myState — Government Services for Citizens #ETHDenver2020


<p><strong>Historical context: </strong>Two’s Complement is a<a href="https://en.wikipedia.org/wiki/Two%27s_complement"> mathematical operation</a> used to store binary numbers on a computer. 💻🤓</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*zi1JAsF-_E1Z10J4ZjRjpQ.png"><figcaption><strong>Two’s Complement:</strong> near-perfect operational chemistry between the analytical left brain and imaginative right brain.</figcaption></figure><p><strong>Two’s Complement:</strong> near-perfect operational chemistry between the analytical left brain and imaginative right brain.</p>
<p>When we first began building together, we experienced something rare: <strong>near-perfect operational chemistry between the <em>analytical</em> left-brain and <em>imaginative</em> right-brain.</strong> We call this wonderful phenomenon Two’s Complement (2C for short).</p>
<p>The holy grail of design and development leadership can be found by crafting an environment with minimal inefficiencies between <strong>analytical</strong> and <strong>imaginative</strong> thinking. The most efficient method for building excellent products combines both mindsets into a careful flow of productivity.</p>
<p>Leaders often group <strong>developers</strong> into <em>logical, mathematical, </em>and<em> analytical</em> thinkers — and <strong>designers</strong> into <em>artistic, intuitive, </em>and<em> imaginative</em> thinkers. Nico and I think it’s harmful to generalize these groups, and see both schools of thought as a <em>core competency</em> for designers <strong>and</strong> developers.</p>
<h3>🧠 Left-Brain Analytical Thinking</h3>
<h4>💻 Developers use left-brain thinking to perfect their code.</h4>
<p>This mindset helps to:</p>
<ul>
<li>Organize code into logically maintainable shapes and sizes</li>
<li>Achieve optimal product efficiency and speed</li>
<li>Solve mathematical or logical problems, systematically</li>
</ul>
<h4>🖌 Designers use left-brain thinking to strengthen their design.</h4>
<p>This mindset helps to:</p>
<ul>
<li>Ensure usability of the product interface</li>
<li>Reason about the viability of a particular feature</li>
<li>Analyze the user’s core problem to solve</li>
</ul>
<h3>🧠 Right-Brain Imaginative Thinking</h3>
<h4>💻 Developers use right-brain thinking to expand upon previously documented methods for using code.</h4>
<p>This mindset helps to:</p>
<ul>
<li>Explore ways to use existing technology in order to achieve something new</li>
<li>Imagine simple or clever ways to solve seemingly impossible problems</li>
<li>Write code in an intuitive format that’s easy to understand</li>
</ul>
<h4>🖌 Designers use right-brain thinking to enhance product experiences.</h4>
<p>This mindset helps to:</p>
<ul>
<li>Create intuitive and delightful products or visuals</li>
<li>Imagine life and daily rituals from the perspective of a user</li>
<li>Invent new approaches to existing paradigms</li>
</ul>
<h3>🔀 Where the Roads Meet</h3>
<p>The science of brain function is <em>constantly</em> developing (just like us, ha!) — regardless of which part is responsible for these mindsets, it is extremely difficult to focus on <em>both,</em> simultaneously.</p>
<p>The core belief behind Two’s Complement (2C for short) is that our best work is produced when multiple people collaborate at once, each bringing a focus on <em>analytical</em> or <em>imaginative</em> thinking. This can obviously work at scale, but the complement between <strong>two people</strong> is perfectly balanced. When <a href="https://medium.com/u/e4c90a0226b1">Nico Valencia</a> and I work side by side, taking turns focusing on analytical and imaginative perspectives. We stitch this philosophy into our workshops, training, and design + development process.</p>
<p>We have found a handful of similar teams that balance these forces well. Here are a few that inspire us:</p>
<ul>
<li>Charles and Ray Eames</li>
<li><a href="https://medium.com/u/f0960a43a793">Berger Föhr</a></li>
<li><a href="https://medium.com/u/8a31291cf79d">TNKR Design Co.</a></li>
</ul>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/352/1*V8Ejmal5QT0s7UF0Q4aotQ.png"></figure><h4>About the Authors</h4>
<p><em>Katy and Nico are Partners at </em><a href="https://www.twoscomplement.io/"><em>Twos Complemen</em></a><em>t, a design and technology studio in Boulder, Colorado. Connect with them everywhere </em><a href="https://twitter.com/KatyJeremko"><em>@katyjeremko</em></a><em> and </em><a href="https://twitter.com/nico_valencia"><em>@nico_valencia</em></a><em>.</em></p>
<p><strong>We want to know, </strong>what do you think? How do you balance the left-brain and right-brain in your process? Share your thoughts, give feedback, and comment below! 👏🏼</p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=3676b505de1f" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/what-is-twos-complement-2c-3676b505de1f">What is Two’s Complement? (2C)</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


What is Two’s Complement? (2C)


<p>A brief chronology of web applications to explain <strong>what kinds of web apps exist today</strong>, how these came about, <em>and what’s coming next</em>.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*mQYvCLZs9j0Tkt51OgU_tQ.gif"><figcaption>Image credit: <a href="https://medium.com/u/30d0791f5761">Katy Jeremko</a></figcaption></figure><h3>🏰 Past</h3>
<h4>Server Side Rendering (SSR) —1990s</h4>
<p>SSR was the original way to deliver web apps over the Internet. A computer in a warehouse (like Amazon’s AWS) runs code to build a page when you ask for it in your web browser.</p>
<blockquote>📩 — SSR is like a snail mail order: you send a letter requesting something (web page). It goes to the warehouse where they put your order together and send it back to you (web page).</blockquote>
<p>SSR is less of a web app category, and more about the way pages are built and delivered to you over the Internet.</p>
<h4>XMLHttpRequest (XHR) / Ajax — 2000</h4>
<p>At the very end of 1999, browsers began adding support for XHR. This allowed the use of Asynchronous JavaScript and XML (Ajax) to build web apps that could load additional information, after the original page was finished loading, then modify the page without navigating to another part of the app.</p>
<blockquote>🍜 — Imagine ordering soup at a restaurant (web page). It’s not spicy enough. Instead of asking the kitchen to make a whole new bowl of soup that’s spicier, you just ask for some pepper (additional information). Ajax lets the browser ask for additional information to modify the web page.</blockquote>
<p>Ajax gained popularity in the early 2000s, exploding with the introduction of the Prototype and jQuery JavaScript libraries in 2005–2006.</p>
<h4>Single Page Applications (SPA)— 2003</h4>
<p>Popularity of Ajax continued to grow, until the mid-to-late 2000s when the open source community began experimenting with SPAs. A SPA loads a single web page from the server, then continues to modify that page for the entirety of the app experience.</p>
<blockquote>💅 — a SPAs is like an all-inclusive resort. Once you travel to the resort (web page), everything you want is managed and brought to you behind the scenes. You don’t need to travel anywhere else or change your context the entire trip. The experience is fully fluid, and there are no jarring wait times or holdups.</blockquote>
<p>Most JavaScript web app frameworks &amp; libraries based their architecture on a SPA experience: <a href="https://en.wikipedia.org/wiki/Backbone.js">Backbone.js</a>, <a href="https://en.wikipedia.org/wiki/AngularJS">AngularJS</a>, <a href="https://en.wikipedia.org/wiki/Ember.js">Ember.js</a>, <a href="https://en.wikipedia.org/wiki/Knockout.js">Knockout.js</a>, <a href="https://en.wikipedia.org/wiki/Meteor_(web_framework)">Meteor.js</a>, <a href="https://en.wikipedia.org/wiki/ExtJS">ExtJS</a>, <a href="https://en.wikipedia.org/wiki/Vue.js">Vue.js</a> and <a href="https://en.wikipedia.org/wiki/React_(JavaScript_library)">React</a>.</p>
<h4>Packaged for mobile (iOS/Android) — 2007</h4>
<p>When the iPhone launched in 2007, Steve Jobs originally intended iOS apps to be written and delivered as web apps. The terrible performance of web apps resulted in a need for something snappier, thus iOS and Android native apps were born, eventually delivered via the Apple App Store and Google Play Store.</p>
<h4>Native-wrapped web apps (ie. PhoneGap/Cordova) — 2009</h4>
<p>While many popular apps were delivered in native code — Objective C (iOS), and Java (Android), many web developers wanted in on the app store action. Projects like PhoneGap allowed a web app to be wrapped in native code and deployed to the app store as a native app.</p>
<blockquote>🗣 — *Native apps* are like speaking fluently in your own language: you understand the features and intricacies of the language and are efficient in communicating complex thoughts. *Native-wrapped apps* are like speaking in a foreign language: you understand how to use basic features, but are slower and struggle communicating more complex ideas.</blockquote>
<p>These solutions were great for certain things; however, they faced tremendous performance and consistency issues across the growing number of device types.</p>
<h4>Progressive Web Apps (PWA) — 2010–2015</h4>
<p>PWAs encompass browser functionality that enable traditional web apps to behave more like a native app. Core features include offline support, push notifications, and a growing number of hardware features like camera or GPS integration.</p>
<blockquote>🦄 — Adding PWA support to a web browser is like offering a common language so everyone can collaborate with the same efficiency. Rather than needing a personal translator, web apps can communicate fluently with features (like camera or GPS), regardless of the language (web, native, etc.).</blockquote>
<p>Google has been a significant advocate for supporting PWA functionality in desktop and mobile Chrome. The concept of PWAs only work as much as browser vendors support the W3C specification.</p>
<h4>Hybrid web apps (ie. React Native, Ionic) — 2015</h4>
<p>Facebook championed the concept of hybrid web apps in 2015, launching React Native. Hybrid web apps allow certain parts to be written in web code, and other parts in native code.</p>
<p>This approach was meant to fix many of the performance issues with Facebook’s then-web-heavy app approach by combining the benefits of native with web in a way that helped support code re-use and team collaboration.</p>
<h3>💻 Present</h3>
<p>These three options represent most of today’s web applications. No method is “right” or “wrong”, as they solve different problems.</p>
<h4>Native-wrapped Web App</h4>
<p><strong>Pros:</strong></p>
<ul>
<li>Build once, use everywhere</li>
<li>Some control of device functionality</li>
</ul>
<p><strong>Cons:</strong></p>
<ul>
<li>Poor performance</li>
<li>Complex build process</li>
<li>Limited or inconsistent control of the device</li>
</ul>
<p><strong>Conclusion:</strong> access to device functionality — cameras, GPS, etc.— can add great opportunities to enhance modern web applications. A wrapped application can save significant money, compared to building native apps for iOS, Android, and Windows. That being said, many teams are opting for hybrid web apps instead, seeking better device support and performance. Today’s primary use-case is quick and inexpensive development on a cross-platform app that needs to be distributed via the app store.</p>
<h4>Hybrid Web App</h4>
<p><strong>Pros:</strong></p>
<ul>
<li>Build some parts once, use everywhere</li>
<li>Use familiar framework across web/mobile teams</li>
<li>Better control of the device than a native-wrapped web app</li>
<li>Native performance</li>
</ul>
<p><strong>Cons:</strong></p>
<ul>
<li>Difficult to customize interface</li>
<li>Requires native and web developers</li>
</ul>
<p><strong>Conclusion:</strong> hybrid apps have resulted in high profile experiences that feel snappy, and have access to specific hardware features, like Facebook, Instagram, and Twitter. This approach saves cost when building well-vetted designs across multiple platforms, but can cost more than it’s worth on an early stage application. The deciding factor for choosing a hybrid app is typically the overhead attached with writing both native and web code, the need for hardware specific features, and app store distribution.</p>
<h4>Progressive Web App</h4>
<p><strong>Pros:</strong></p>
<ul>
<li>Build once, use everywhere</li>
<li>Offline mode</li>
<li>Native push notifications &amp; <a href="https://developers.google.com/web/fundamentals/app-install-banners/">add to homescreen</a>
</li>
<li>Search Engine Optimization (SEO) advantages</li>
<li>Partial native device functionality</li>
<li>Most reliable/stable</li>
</ul>
<p><strong>Cons:</strong></p>
<ul>
<li>Partial support in iOS</li>
<li>Lacking some native device functionality</li>
</ul>
<p><strong>Conclusion:</strong> PWAs are currently undergoing a major growth-spurt. Web browser vendors, particularly Apple, are rapidly supporting more progressive functionality, and the combination of speed, SEO, offline mode, and various device functionality has made PWAs a perfect strategy for launching cross-platform application experiences, at an approachable cost. PWAs can also be enhanced with hybrid functionality at a later time, as well as be rendered server-side (SSR) or client-side (CSR). A PWA is most likely the best choice if the core user interactions can be technically supported.</p>
<h3>🔮 Future</h3>
<h4>Asm.js / WebAssembly (Wasm)</h4>
<p>A collaborative project (W3C, Mozilla, Microsoft, Google, Apple) that allows developers to write code in any language, then deploy it across hundreds of devices.</p>
<p>Wasm is intended for highly performance-intense operations and — while mostly experimental now— is being leveraged by a significant number of companies to develop next-generation graphics and processing abilities for web apps.</p>
<h4>Web3 / Dapps</h4>
<p>The blockchain ecosystem has invented a concept for the Internet’s infrastructure: allow everyone in the world to lend their computer, laptop, or cell phone, in order to create a massive world-wide computing system.</p>
<p>This decentralized system could solve several traditional challenges, such as sharing data in low internet connectivity areas, ensuring security and availability of important web content, and allowing safe and affordable financial transactions to happen between international parties.</p>
<p>Due to the alternative approach of this system, a slightly different set of end-user experiences are required to interact with this concept network. Decentralized applications — or “Dapps” — combine traditional [Web 2.0] app technology with decentralized “Web3” counterparts.</p>
<h4>Progressive Web Apps +</h4>
<p>Adoption of progressive functionality has spurred massive collaboration between browser vendors, which will likely result in converging benefits between native and web development. This means investing in PWAs now will likely pay-off down the road, as new functionality is added in the coming months.</p>
<p>Google has doubled-down advancing PWA capabilities over the past year, bringing more of the functionality from native devices to web apps that maintain effective SEO, customizability, offline support, and affordable development costs. These abilities will continue to trend towards those of native apps found in the app store, creating a diverse set of approaches to creating an excellent user experience.</p>
<p>We’d love to see more <strong>integration with IoT and digital assistant ecosystems</strong>. This might include hybrid web and voice-controlled apps, or IoT networked systems that lend functionality to web apps. What will web apps look like when cars can fly, robots cook breakfast, and disco is back in style?</p>
<p><strong>tl;dr</strong> — web apps can be built and deployed several ways. Each method is great for specific reasons, so make sure to understand the benefits and pitfalls of each.</p>
<p>Are you building a web app? We’d love to hear about it, or work together at <a href="https://www.twoscomplement.io/">Two’s Complement</a>. Share your thoughts with us <a href="https://twitter.com/twos_complement">on Twitter</a>!</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/200/1*JAX51JtUFKdSXVCxtQhB3w.png"></figure><h4>About the Author</h4>
<p><em>Nico Valencia is a Partner at </em><a href="https://www.twoscomplement.io/"><em>Two’s Complement</em></a><em>, </em>a design and technology studio.<em> Connect with him at </em><a href="http://twitter.com/nico_valencia"><em>@nico_valencia</em></a><em>.</em></p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=3f1f6d2b0b06" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/web-apps-past-present-and-future-3f1f6d2b0b06">Web Apps: Past, Present, and Future</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Web Apps: Past, Present, and Future


<p>What is your split between building things for work, and for fun?</p>
<p><strong>50/50?</strong> 😃</p>
<p><strong>80/20? </strong>😕</p>
<p><strong>100/0?</strong> 😧</p>
<p><strong>Opinion: </strong>Hacking,<strong> just for fun</strong>, is the <strong>#1</strong> healthiest thing a maker can do.</p>
<p>By hacking, I mean designing, building, or creating <em>anything</em>.</p>
<p>What was the last thing you built, just for fun? How did it make you feel? Maybe you felt like it wasn’t your best work. Or, maybe it’s the coolest thing you’ve gotten into this year. Regardless, how did you feel on the other side?</p>
<p>We’ve been building a lot this year. Fun things. Things that grow our curiosities in tech and design. Things that charge us up instead of grind us down. This concept is fairly obvious, but time slips away from even the most careful self-activated life-hackers.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*7vh-dfz4jjhTQ8rfLp77Bg.jpeg"></figure><h3>Reasons hacking for fun is so important</h3>
<ol>
<li>
<strong>Delivery cadence affects happiness</strong> — Research shows that <em>frequency 👍 </em>typically matters more than the <em>quality</em> 👎 of a reward. Most jobs tend to be organized around <em>long term</em> objectives, delivered monthly, quarterly, or even yearly. This is necessary for business growth and planning, but needs to be accompanied by smaller project wins for your own happiness.</li>
<li>
<strong>Practicing outperforms reading</strong> — Humans learn more efficiently from practicing than reading. This is why kids do homework after school. When I learn a new programming language or tool, it takes several months of reading to wrap my head around the concept 📚🤷‍♂️. Alternatively, I can dig into a project with new tech, hands-on, and ramp up in just a couple weeks 🔨🏃‍♂️. This effect is amplified if it’s something you’re truly curious about. Practice, like this, results in increased motivation and confidence in your career work.</li>
<li>
<strong>Curiosity drives productivity</strong> — Working on something interesting tends to be much more productive. Multiple studies show that nurturing curiosity results in improved brain function 🧠⚡️. This explains why it’s easier to remember a fact after your curiosity prompts a question, versus something told to you in passing. Hacking, just for fun, allows you to <em>exclusively</em> focus on things that nurture your curiosity.</li>
</ol>
<blockquote>📅</blockquote>
<blockquote>Open your calendar! Take a minute to block off a weekend, and label it “<strong>Hack, just for fun</strong>”.</blockquote>
<p>Here are a few projects to get you inspired:</p>
<h4>Node Pong</h4>
<a href="https://medium.com/media/e229d151541d3b66016ddff15bb53b4e/href">https://medium.com/media/e229d151541d3b66016ddff15bb53b4e/href</a><p>A while back, we were preparing for an upcoming project with <a href="https://www.allstate.com/">Allstate</a> to build a mobile-web football game for the Sugar Bowl. I was curious how Facebook developers were building mobile-web games, and fell into a fit of experimentation with Three.js, OpenGL/WebGL, and 3D video game rendering.</p>
<a href="https://medium.com/media/131354c80de32bf02e2c61b5931ec682/href">https://medium.com/media/131354c80de32bf02e2c61b5931ec682/href</a><p>The experimentation resulted in a JavaScript 3D pong game, wired up to Nintendo wiimotes via Arduino interfaces &amp; ZMQ messaging. I felt much more productive going into our client project, having strengthened relevant skills and exploring curiosities beforehand.</p>
<p>We make this a habit when starting new projects: take some personal time before each project to explore alternative technologies and curiosities in the related problem space.</p>
<h4>IPFS Stash</h4>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*xombHzxsa5uL_o9M.jpg"></figure><p>Last month, <a href="https://medium.com/u/30d0791f5761">Katy Jeremko</a> and I participated in ETH Denver (as hackers instead of organizers this time)! We are avid supporters of decentralized ecosystems like Ethereum and IPFS, and wanted to explore improved user experiences for non-technical web users.</p>
<p>We created a Chrome browser extension that allows users to add and organize files in IPFS by simply clicking on them. It was fun making something complicated so easy for a consumer — especially in areas of high censorship or poor internet connections. <a href="https://github.com/nicovalencia/ipfs-stash">Check out the code on Github.</a></p>
<h4>CSS Pixel Grid</h4>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/912/1*ai0W3HMN8kLM61hHhSRQNA.gif"></figure><p>A few weeks ago, <a href="https://medium.com/u/30d0791f5761">Katy Jeremko</a> and I were discussing whether it would be possible to represent an image file as a programmatically generated CSS grid. Once we got data rendering as colorful art-like pixel grids, our curiosity started to beg answers to how tools in Photoshop work.</p>
<p>At the end of the night, we had recreated our version of common photo editing tools like brighten, darken, blur, etc. I woke up the next morning excited to jump into code again, rather than feeling fatigue from my current project.</p>
<h4>Other Projects &amp; Ideas</h4>
<p><a href="https://medium.com/u/30d0791f5761">Katy Jeremko</a> and I are always coming up with fun ideas. Here are some other projects we have going:</p>
<ul>
<li>3D printed LED Deadmau5 helmet</li>
<li>Cooking / Recipe mobile application</li>
<li>Daily goal tracking app</li>
<li>Habit forming / money saving games</li>
<li>RPG games (&gt;9000 of them)</li>
</ul>
<p><strong>tl;dr</strong> — make time to hack on a project for fun. You’ll be glad you did.</p>
<p>Are you hacking for fun? We’d love to hear more, or work on something neat together. Share your projects and ideas with us <a href="https://twitter.com/twos_complement">on Twitter</a>!</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/200/1*JAX51JtUFKdSXVCxtQhB3w.png"></figure><h4>About the Author</h4>
<p><em>Nico Valencia is a Partner at </em><a href="https://www.twoscomplement.io/"><em>Two’s Complement</em></a><em>, </em>a design and technology studio.<em> Connect with him at </em><a href="http://twitter.com/nico_valencia"><em>@nico_valencia</em></a><em>.</em></p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=1b4ff632159b" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/hacking-for-fun-a-makers-superpower-1b4ff632159b">Hacking for fun: a maker’s superpower</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Hacking for fun: a maker’s superpower


<h3>IPFS Stash — Local IPFS for everyone #ETHDenver2019</h3>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*6EwcVvt2aNO-27uGV6peMw.jpeg"><figcaption>Post demo at ETH Denver 2019</figcaption></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/895/1*SnEhWAyLHfmZOApYPCElWg.png"></figure><p><a href="https://medium.com/u/30d0791f5761">Katy Jeremko</a> and I made our way to Denver Colorado this weekend for ETHDenver — a globally attended Ethereum developer conference and hackathon. We pulled our first all-nighter since college, saw dozens of inspiring projects, and actually enjoyed buying food with crypto (nice work <a href="https://medium.com/u/fdf5d07fdcf9">Jonathan Palmer</a>, <a href="https://medium.com/u/f678d5eb3101">Brian Ethier</a>, and <a href="https://medium.com/u/3f2f35c52f36">Austin Griffith</a>)!</p>
<p>ETHDenver 2019 was a huge success, hosting <strong>1,500</strong> attendees, <strong>750</strong> hackers, and resulting in over <strong>170</strong> #buidlathon teams. <em>Contestants had less than 36 hours to complete and demo their project. </em>Most teams worked all night, just to finish in time.</p>
<h3>Two's Complement on Twitter</h3>
<p>Sweet dreams, #buidlers. This was a snapshot at 12:44am the day before hack submissions were due -- we stayed up another 4 hours for our @protocollabs #IPFS + chrome extension project "Stash". https://t.co/dZXQaXv5RB</p>
<p>The Ethereum community has poured its heart into building a technical ecosystem that provides <a href="https://medium.com/uport/what-is-a-uport-identity-b790b065809c">self sovereign identity</a> in developing nations, easy to use <a href="https://alice.si/">transparent social funding</a>, and <a href="https://ipfs.io/">low cost censorship resistance</a>. We wanted to contribute to a project that’s supporting this sort of impact, and realized that it’s still very difficult to understand, and use, many of these highly-technical projects.</p>
<h3>Technical Primer</h3>
<p>If you are familiar with Ethereum and IFPS, keep scrolling a bit.</p>
<p><a href="https://www.ethereum.org/">Ethereum</a> is a software project that unlocks the potential of idle computers, cell phones, and other assorted hardware devices around the world. Devices running this software can collaborate with each other safely, using cryptography to ensure security in a way that wasn’t accessible at a global computing scale in the past.</p>
<p><a href="https://ipfs.io/">IPFS</a> is a file storage counterpart to Ethereum. If Ethereum is running all the code (like a world-wide super computer), IPFS is like the giant hard drive that stores all the files, and makes them easy for everyone to access.</p>
<p>These decentralized technologies <em>sound</em> amazing in a theoretical sense, but their value can’t fully be appreciated until enough participants (<em>like you</em>) decide to use them. Imagine the first telephone… not very valuable on its own, but provides huge value once adopted.</p>
<h3>IPFS Current State</h3>
<p>Anyone can run IPFS on their computer to store, access, and share files. IPFS makes browsing the internet faster — for example: if you load a webpage from the internet, it might ask your neighbor’s computer for that data, rather than going all the way to another state or country to load it from an expensive server. It also safeguards against censorship, document identity fraud, and a host of other cloud storage safety issues.</p>
<p>Only problem: it’s still early on, and very difficult to use.</p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/600/1*ScWCGZ3b3jCIipgzL5sllA.gif"><figcaption>This is actually me reviewing a commit, but you get the idea…</figcaption></figure><h3>Our Project — Stash</h3>
<p>In light of this challenge, we designed and built a browser extension to show how decentralizing and saving files can be as easy <strong>as easy as clicking on them</strong>.</p>
<p>We began with the question:</p>
<blockquote>What task in the Ethereum ecosystem can we simplify into a single click?</blockquote>
<p><em>Technically</em>, a developer can setup an IPFS environment, configure the APIs, and expose a local endpoint that allows for adding, pinning, creating a mutable file system (MFS) directory, and moving content hashes to and from… <strong>but can we get someone non-technical to do it in a single click?</strong></p>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/857/1*9IBOGNZbM4UFiPmjIc_tmQ.gif"><figcaption>With the Stash Chrome extension, adding files to IPFS is as easy as clicking them.</figcaption></figure><p>After clicking on files you want save, you can open the IPFS “Stashboard” to view and organize your files into “stashes”.</p>
<a href="https://medium.com/media/5e85ecb7512045ce5de6def6d0da78d1/href">https://medium.com/media/5e85ecb7512045ce5de6def6d0da78d1/href</a><p>Building Stash felt like we were experimenting in a way that encouraged more thought around usability and experience of decentralized tech for the average person.</p>
<h4>Stats</h4>
<ul>
<li>2 people: <a href="http://www.twoscomplement.io/">designer and developer duo</a>
</li>
<li>22 hours 10 minutes of non-stop hacking</li>
<li>1 hour 33 minutes of sleep</li>
<li>42,168 lines of code (including vendor)</li>
<li>207 stickers collected</li>
<li>$100 of <a href="https://buffidai.io/">Buffidai</a> spent [mostly] on food trucks</li>
</ul>
<h3>Impact</h3>
<p>This year’s theme at ETH Denver was <em>social impact</em>. IPFS could help target areas of low internet connectivity and censorship. The teams who have brought world-changing technology, like Ethereum and IPFS, need as much community support as possible with one thing: <strong>adoption</strong>.</p>
<p>We had a blast prototyping ways to explain and provide IPFS to a normal internet user. If you’d like to help with social impact, and understand the basic value of decentralized technologies (or any technology, for that matter), we’d encourage you to do the same. The more ideas and concepts we can prototype, the quicker these technologies can be adopted and bring value to underserved communities.</p>
<h3>Vision</h3>
<p>Our project was just for fun, but our minds went wild brainstorming potentially impactful uses:</p>
<ul>
<li>Storing important public government records in areas of low internet connectivity or potentially corrupted local agencies</li>
<li>Efficiently and affordably storing internal corporate files, with even greater redundancy (safety) than cloud hosting</li>
<li>Stand-alone native application that fleshes out the user interface, mimicking native file systems like Finder in Mac, and Explorer in Windows</li>
<li>Leveraging an in-browser IPFS node, using something like ipfs js, to make the entire installation process a single click</li>
<li>Collaborating with browser developers to build native IPFS support into a pre-existing widely adopted web browser</li>
</ul>
<h3>Learnings</h3>
<h4>Naming things is super important</h4>
<p>During our user experimentation and judging, our biggest sticking point was naming. What do you call a thing that you want to save? Data? A File? Sometimes it’s an image… or a video. But what if it’s just a sentence from a blog? Or a series of articles on Medium?</p>
<p>We tried to keep our domain name to a single word: stash — described as: a bucket for holding things from the internet. First we tried “buckets”, “folders”, “directories”, and “collections”. Typically, we’d love to do real user testing at scale, but the dozens of friendly hackers nearby were very helpful at 2am in the morning.</p>
<h4>Browser vendors should support IPFS</h4>
<p>There are a few obvious, and many not-so-obvious incentives for existing browser vendors <strong>not </strong>to<strong> </strong>support decentralized technologies, but performance alone is a solid reason to at least <em>experiment</em> with native IPFS implementations.</p>
<p>Imagine if every browser could share public resources with the closest nearby device. Imagine if that website could be built out of bits and pieces from your colleagues’ computers, rather than on expensive servers a thousand miles away. Shoutout to <a href="https://github.com/brave/browser-laptop/issues/9556">open source contributors</a> already working on this with <a href="https://brave.com/">Brave</a>.</p>
<h4>Hackathons are free training workshops</h4>
<p>After paying for several (very helpful) training workshops in the past, this weekend reminded me of how much you can learn from a hackathon <strong>for free</strong>. Dozens of participants attended purely for support — to help hackers experiment, debug, and learn. A building full of concentrated developers, designers, and entrepreneurs really helps get the brain going.</p>
<p>Huge shoutout to teammates from <a href="https://www.textile.io/">Textile</a> and <a href="https://pinata.cloud/">Pinata</a> for sharing their knowledge about IPFS with us. They helped vet our ideas, and got us from zero to working knowledge in under an hour. We tried to return the favor to others as best we could, so thanks guys! It was an amazing experience to see so many passionate hackers in one building at ETHDenver 2019, and hope to see everyone again next year!</p>
<blockquote>Never doubt that a small group of thoughtful, committed citizens can change the world. Indeed, it is the only thing that ever has. — Margaret Mead</blockquote>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=b5b45ae0d5c9" width="1" height="1" alt=""><hr>
<p><a href="https://medium.com/twos-complement/ipfs-stash-local-ipfs-for-everyone-ethdenver2019-b5b45ae0d5c9">IPFS Stash — Local IPFS for everyone #ETHDenver2019</a> was originally published in <a href="https://medium.com/twos-complement">2C | Two’s Complement</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


two's complement

Home

Design

Development

The Indie DAO

About 2C

Blog

There is more 2C

Announcing The 2C IndieDAO

True Review: Censorship-resistant reviews

Config Europe: Designing a design tool

6 Crucial Tools for Remote Team Success

Figma’s First Conference — Config2020

Secure myState — Government Services for Citizens #ETHDenver2020

What is Two’s Complement? (2C)

Web Apps: Past, Present, and Future

Hacking for fun: a maker’s superpower

IPFS Stash — Local IPFS for everyone #ETHDenver2019

Join the Edgelist

Contact Us