Skip to content

Instantly share code, notes, and snippets.

View L8D's full-sized avatar

Tenor L8D

View GitHub Profile

Hello! This is the Free Market team. We’re excited to introduce some design concepts you can find in our upcoming product, xDeposit. Below, we will be exploring demonstrations built with React, TypeScript and Framer Motion.

When evolving our approach to design, we try to find innovative ways to reduce the visual cognitive overload that appears to be under-addressed in the overwhelming majority of web design that we experience everyday.

Reducing Cognitive Load: Anti-Modal

One of the innovations which can reduce cognitive load is eliminating unnecessary use of modals. If you believe that modal windows are completely harmless, you might be wondering “what’s wrong with a simple modal, here and there?” It may be a surprise that there are many disadvantages to modals which may lead to sloppy UX. Modals could overload your users with too many cognitive changes.

If you are interested in UX, I highly recommend reading Therese Fessenden’s exciting write-up on modal dialogs, titled [Modal & Nonmodal Dialogs: Whe

Bootstrapping lean product research

Alternative title: Getting off the ground with lean product research

In Marty Cagan’s talk, Product is Hard, Cagan offers a comprehensive look at his vision for product management. Cagan touched on a key difference between feature teams and Cagan’s "product teams." He emphasized that product teams have a process for product discovery, which sequences work differently and separately from the product delivery process.

Make sure to watch the full talk if you have the time. For now, let’s take a look at one of Cagan’s diagrams which illustrates the relationship between the product discovery and product delivery.

modern product process

TENOR BIEL - PORTFOLIO EXCERPTS

All prototypes, branding experiences and design concepts below are built with TypeScript, React, TailwindCSS and Framer Motion.

Prototype - xDeposit.app

01.Prototype.-.xDepost.mov

@L8D
L8D / foo.html
Created December 15, 2020 15:22
<!DOCTYPE html>
<html>
<head>
<title>How not to Scuttlebutt</title>
<meta charset="utf-8">
<style>
@import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);
@import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic);
@import url(https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic);
@L8D
L8D / median.rb
Last active February 21, 2018 21:41
Median of array in ruby
def median_of a
return nil if a.empty?
sorted = a.sort
len = sorted.length
(sorted[(len - 1) / 2] + sorted[len / 2]) / 2.0
end

Keybase proof

I hereby claim:

  • I am L8D on github.
  • I am l8d (https://keybase.io/l8d) on keybase.
  • I have a public key whose fingerprint is 4832 9B22 CE81 B2BF 5C92 C2BE 59BC FB0F CFAF 17CF

To claim this, I am signing this object:

function Signal(sub) {
this.sub = sub;
}
Signal.prototype = {
/**
* Applies the given function over each event.
*/
map: function(fn) {
var sub = this.sub;
@L8D
L8D / test1.js
Created January 6, 2016 21:17 — forked from anonymous/test1.js
var http = require('http');
var fs = require('fs');
// write out numbers
function writeNumbers(res) {
var counter = 0;
}
// increment global, write to client
for (var i = 0; i < 100; i++) {
counter++;
res.write(counter.toString() + '\n');
@L8D
L8D / test.js
Last active January 4, 2016 00:19 — forked from oroce/test.js
var gimmeFullscreenMethod = function() {
'use strict';
var el = document.documentElement, open, cancel, video;
open = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen;
cancel = el.exitFullscreen || el.webkitExitFullscreen || el.mozExitFullscreen || el.msExitFullscreen;
if (open) {
return {
@L8D
L8D / hi.bf
Last active January 3, 2016 13:19
Output: "hi\n"
+++++ +++++ [ > +++++ +++++ > + << - ] > ++++ . + . > .