Category Archives: Design

Design, DIY

Onewheel - A 2000 Mile Review

Back in 2016, I unexpectedly managed both of my fantasy baseball leagues to victories for a generous windfall of $1500. As a responsible mid-20's adult, I purchased the Onewheel V1 having never ridden the board before with all of my winnings. I took a huge financial gamble on a Santa Cruz, California-made electric motion device based on online reviews only. It changed my life.

During my Berzerkeley days, I was commuting from the Berkeley Hills all the way to Palo Alto. I use to drive to BART, BART to Lake Merritt, and then shuttle to Palo Alto. Yes, I agree - it was insane, but the Onewheel made it doable.

It never snows in the bay area, but riding the Onewheel down the Berkeley hills every weekday morning was honestly better than snowboarding. My daily ride was so damn predictable: I never "caught an edge", I never had any mechanical or electrical failures, I carved every surface imaginable down and up the hills, rain or shine. I transitioned from longboarding to Onewheeling within a month's time. Thankfully, in the first 100 miles of riding the board, I managed to escape any serious injury without wearing a helmet. Don't be like me, seriously, WEAR A HELMET!!!

Back in 2016, personal electric transports were not popular in the bay area; Lyft and Uber had only just started getting popularized! Those days, only Santa Monica had Scooter Fever.. Every day I rode the Onewheel, I was inundated with questions and comments from random strangers, coworkers, and kids: "Does it run on electricity?", "How fast does that thing go?", "What's the battery life like?", "How much did you pay for it?", "How do you balance on it?", "Did you build that yourself?", "DO A KICKFLIP!". Wow, I finally understood what it felt like to be a hot chick with headphones on... (Seriously, don't bother people with headphones on in public. SERIOUSLY!!111)

Fast forward to 2019...

The future of personal electric transports is now! Aside from the Onewheel, there are so many amazing battery-powered, electric transports ubiquitous today: Tesla's, Electric motorcycles, Electric rickshaws, Electric bikes, Lime/Bird scooters, Segways, Hoverboards, etc. These personal electric transports solve the last mile equation for commuting. Why travel in a 3000 pound gas-guzzling $12 Lyft/Uber ride, when you can enjoy the journey to your destination on a 25 pound electric transport for a fraction of the price?? The ELECTRIC REVOLUTION is here!!!

So.. How has my Onewheel held up after 2000 miles? Maintenance-wise, I carved the OEM Vega Tire to its core in under 500 miles. Future Motion replaced the BMS (battery module system) once - after riding through a massive puddle - to the tune of $460. My board's batteries still delivery a healthy 4-7 miles of range, so I don't find myself needing to upgrade anytime soon. These electric motors dramatically simplify the number of parts needed to function for thousands of miles - I look forward to celebrating my Onewheels' 3000 and 4000-mile marks soon! Finally, after 3 years of ownership, I no longer get asked daily questions about my Onewheel in the bay area; however, your experience may vary.

ADVANCED TECHNOLOGY: I love the vertically-integrated experience of my Onewheel V1. It's an engineering marvel:

  • It regenerates energy when riding downhill by running its flywheel in reverse - just like an electric car! Make sure not to charge it to 100% before riding though, otherwise it will shut off mid-ride due to overcharge. The 4-8 mile battery life is perfect for riding to and from public transit across any terrain.
  • It houses 130Wh of Lithium Iron Phosphate (LiFePo4) batteries underneath the foot pads. Compared to lithium ion batteries, this battery chemistry is resistant to overheating in exchange for energy density. Guess what?? There has never been a self-immolating Onewheel, and this specific Onewheel can be flown on planes.
  • Ultra-fast charging via a wall outlet. Only 20 minutes per charge, so you can get riding sooner.
  • Modern sensors. It uses two gyroscopes and weight sensors to give a self-balancing, predictable, carvy ride. It rides like a snowboard down hills, like a longboard on flats, like a surfboard in bowls, and like nothing else going up hill. As a longboarder who walked up most hills most of his life, carving up hills is a God-send.
  • Built-in LED lights for night-time riding. There are set of two lighting strips which give you a bright white light for visibility in front and red lights for traffic in the back.
  • Automatic slip and pushback detection. The board corrects itself via software to prevent over-acceleration by the rider and to prevent over-voltage or running out of charge on the board.
  • Weather resistant body construction. Thanks to the aluminum body and a solid plastic fender, none of the edges have rusted and none of the plywood has molded. In fact, I ride through the streets on light, rainy days without any issue.
  • It comes with a companion mobile app complete with leaderboards, accurate telemetries, debugging information, notifications, and a lifetime odometer. Best of all, the Onewheel connects via bluetooth so you can access all of the information deep in the mountains.

MODS: I love how modular the Onewheel's components are (None of that proprietary Apple non-sense), and I absolutely love how in-depth the Onewheel Community experiments with mods. They explore all sorts of go kart tire options (Hoosier and Burris), Grip tapes (Skate and Surf), and hobbyist renewable energy technology (DC-DC battery fast charging via a Solar MPTT). I highly recommend checking out the community-run products on Craft and Ride, FlightFins, and Float Life. Here's a list of all of the work I've put on my board:

  • Vicious Grip Tape - any skater will tell you the original grip tape sucks. By using a hair-dryer, you can easily swap the grip tape for something more coarse. Better for higher speeds and sharper turns.
  • OWArmor - perfect for increasing visibility at night time and giving your Onewheel a little more personality.
  • Hoosier 6.5" Treaded Tire - swapping the tire is the best thing you can do for your Onewheel. It rides completely differently and the treaded tires help immensely for going off-road. If you choose the 6.5" Hoosier, make sure not to pump it past 14 PSI, otherwise you'll experience rubbing.
  • Aluminum Handle - the Onewheel weighs 25 pounds without any mods; the stock handles are an insane forearm workout. These side handles make it much, much easier to carry your board around.
  • CarvePower DC Charging Kit - going on longer rides with no outlets? No problem, add this convenient on-the-go charging kit for the best trail experience.

If you've read this far, you've probably noticed that I absolutely adore my Onewheel (and my gf too!!). It's part of my everyday life now, and the best money I have ever spent on a consumer electronic. Don't go into debt to buy one, but if you start saving now, you will not regret it. Float on my friends.

Standard
Design

UI Design Fundamentals

I'm going to start doing a new thing where I start using my blog as a note taking resource from all of the books I read! Currently, I'm reading The Design of Everyday Things - Don Norman. I highly recommend this book for anyone looking for a scientific and psychological approach to design. Creativity is important, but there are definitely fundamental steps to help improve your designs.

Let's start with the Fundamental Principles of Interaction. This is for all of the user interfaces people out there :).

  1. Affordances - All of the possible interactions between the people and the environment. Some affordances are perceiveable, others are not. Affordances are relationships between properties of an object and the capabilities of the actor. For example, glass affords transparency - this is a relationship between the glass and the actor's sight. When affordances aren't perceivable, they will need some...
  2. Signifiers - Signals things. Lol, but seriously, signifiers indicate what actions are possible and how they should be done. Signifiers are more important than affordances for they communicate how to use the design. Suppose our glass example were a transparent glass door, we will need to know which way the door rotates right? Push/Pull signs, curved handle bars for a pull, and a large depressable exit door button are some ways to signify how an actor might use this door.
  3. Mapping - The relationship between the elements of two sets of things. In our door example, suppose we had a smart door which could be controlled from a mobile application. Mapping is an important concept in the design and layout of this mobile application's controls and display. We must establish a mapping of the phone display to UI elements which indicate whether to open or close the door. These mappings must be both logical and visible. Once we establish a mapping and press the buttons, we will need...
  4. Feedback - A communication of the results of an action. Feedback must be immediate and informative, any delays will cause reason for concern. In our internet of things smart door example, most feedback from the mobile application will be a touchable opacity to indicate the button was pressed. In addition, the door would have to move right? Feedback from a mobile application to a physical device is awesome and brings us into the Internet of Things (Tesla makes amazing cars and batteries with this capability).
  5. Conceptual Models - An explanation, usually highly simplified of how something works. Think of icons and folders as conceptual models. Would a normal user be able to understand the tree directory structure of the file system?? Hell fucking no. Give them something way easier to digest.

I hope you enjoyed this post! Keep track of all of these basic interactions when starting any of your designs and applications, they are fundamental human understanding. It is my dream to work on some cooler graphical design projects (AR/VR, Unreal Engine, Visualizers) in the future, so stay tuned Internet. (Note: That all projects started by me are never finished by me either hahaha)

For more on UI and other design freelancing opportunities, check out Toptal's design guide.

Standard
Design, Programming

Montserrat Font and Legacy Support

See the ongoing GitHub discussion.

Without going into too much detail, Google updated the Montserrat font and its weights remotely, affecting millions of designs across the world wide web which integrate with Google fonts. This affected me personally, as I use Montserrat for my blog titles.

I absolutely despise API's which introduce breaking changes. All of these breaking changes destroy any legacy applications which are using the API's. Google in particular has a penchant for deprecating, breaking, or removing their API's: remember when the internet of shit's favorite Samsung smart fridge couldn't connect to its dumb calendar? Lol. This time, millions of websites across the web were forcing shitty text overflows down everyone's throats.. Who wants that???

I'm not sure who's in charge of these decisions, but developers - the best rule of thumb to go by is once an API is deployed to production, everything in that API spec cannot change. LEAVE IT BE! The end consumer is always expecting things to abide by the status quo. The majority of users will not update their application, and they will immediately complain about anything that doesn't work at a prolific scale.

It's an awful user experience. All designers and programmers should consider these legacy customers and find creative solutions to scale and expand their API's rather than forcing major upgrades.

Before I sign off here, I'd like to talk about one of my nightmares. I can hear it now...

what about Internet Explorer??

If you don't want to deal with an awful browser or device (Windows phone I'm looking at you), do not build applications for these devices in the first place. Once you decide to start supporting anything at all, you will have to support it for all its technological life.

Standard
Design, DIY, Programming

The Rewards of Full Stack Web Development

This summer I took the road far less traveled.. Having worked for Texas Instruments as my previous summer's Software Internship, I reaped the benefits of having a full time job. Hell, I was making almost 50k as an intern in a state with no state tax -- gotta love Texas. Fully paid living, endless beer, and beautiful Dallas babes.. Why did I even leave??

I don't want to go in depth on what I did for the company because I have a feeling I wrote some seriously wrong database query methods that could very easily be SQL Injected, but it was my first exposure to web development: Microsoft Visual Studio (VB.NET). HTML/CSS/Javascript, I figured out the basics, and I learned how to make serious web scrapers. I thought I was one badass software intern, lol.

I really do thank Texas Instruments for providing me with the opportunity to get started in web development, but all the work I did there merely scratched the surface of what Web 2.0 could do. Last winter, I decided to give Ruby on Rails a shot (shout out to Michael Hartl for one of the best, free, online Rails tutorial). Rails is fucking tough man.. It really did baffle me why they would separate the Models, Views, and Controllers just to render a simple static page. By the end of that tutorial, I still had no idea where to begin, but I had a much better idea of how the MVC interacted, and I also had a glimpse of how easy it is to make Rails dynamic.

And then this summer came rolling along.. I'm currently working part time to pay rent and booze, while working overtime on my startup product. tessle.com Being the only coder on a full stack development project is both physically and mentally draining, but I can safely say that I have learned 50 times as much as I did working for Texas Instruments. So without further ado, here are the rewards of full stack web development: You..

  • Master relational databases
  • Become a master of your framework
  • Understand Javascript and Frontend Development for all of the web
  • Firebug/View source on everything that looks remotely cool
  • Understand how to debug any and all situations for your application
  • Contribute to open source -- stack overflow, railscasts
  • Learn why github and heroku are absolute necessities for making your life easier
  • Appreciate how damn hard development can be
  • Evolve into a coding badass
  • Have a coding baby, one that you have nurtured for the past 6 months which you can proudly call your own... :')

Give it a shot. Even if your baby doesn't grow into anything, you will learn way more than sitting at a desk pretending to do work.

Standard
Design, Programming

Ubuntu Edge Won't You Be Mine?

Ubuntu Edge: The biggest IndieGoGo project to this date needs another 28.5 million in order to succeed. It looks extremely unlikely, but this would be my goto, drop-my-iPhone 5-in-a-heartbeat phone. Screw the MacBook Air, I just need a single mobile device to accomplish all my needs.

I currently use Google Voice, so the ability to text/call from my computer/phone would never leave my pockets, but on top of that, I'll be switching carriers to an unlimited data plan (screw you AT&T), so the ability to access data from anywhere will be crucial to me.

I'm a developer -- the only operating system I can develop on is Linux/Ubuntu.. The days for Windows should be left to bigger desktop towers to render all my games.. Having the ability to morph from a mobile device to a developing platform, Ubuntu Edge is what I once dreamed about.

The nerdiest and geekiest phone. Say Goodbye to the days of Apple/Google Voice, Ubuntu Edge won't you be mine?

Standard
Design, Programming

Add Disqus comments to WordPress and edit CSS

For those of you who have struggled using the Disqus WP Plugin, this guide is for you. I tried using the plugin, but no matter which stylesheets I edited, I couldn't edit the Disqus CSS since the stylesheets are located within an iframe tag. Anyways here's what I did to fix that annoying box/margin error.

Using this guide, I added this JavaScript code to the end of my functions.php file.

function disqus_embed($disqus_shortname) {
    global $post;
    wp_enqueue_script('disqus_embed','http://'.$disqus_shortname.'.disqus.com/embed.js');
    echo '<div id="disqus_thread"></div>
    <script type="text/javascript">
        var disqus_shortname = "'.$disqus_shortname.'";
        var disqus_title = "'.$post->post_title.'";
        var disqus_url = "'.get_permalink($post->ID).'";
        var disqus_identifier = "'.$disqus_shortname.'-'.$post->ID.'";
    </script>';
}

Next, I replaced comments_template(); in my single.php and page.php files with this code:

//comments_template();
echo '<div class="disqus-div">';
disqus_embed('YY');
echo '</div>';

Replace YY with your Disqus short name (typically http://shortname.disqus.com). Finally, I added this CSS to my custom.css file. Replace XX with the margins of your liking.

.disqus-div {
  margin-top: XXpx;
  margin-right: XXpx;
  margin-left: XXpx;
}

You can also add any other CSS you want to this class. Cheers, hope this helps someone.

Standard
Design, DIY

Screw the MacBook Air

I don't know when I actually decided I wanted an Apple computer; I've been using Windows, Ubuntu, and Hackintosh computers for all my life.  I still distinctly recall using MS-DOS to switch to my floppy drive directory in order to play my computer games.

I guess the design of the MacBook Air captivated my technological hormones: 0.68" in height, 2.96 lbs, and 7 hours of battery life -- what's not to love.  After some preliminary research, the 13" MacBook Air runs for about $1500 for the options I want.  Even with the rumored retina screen (which would increase the price by another 200), I still don't think a piece of technology should be priced so damn high.  Call me old fashioned, but I'm still a firm believer in Microsoft products for productivity.

So check it out:  I rigged my Asus U30JC-A1 with some supercharged upgrades.  Although the specifications say that my laptop only supports 4GB RAM, the Intel i3 technology actually supports up to 8GB RAM.  Furthermore, I swapped out the ancient DVD Drive, which also duals as a paper weight, with an SSD caddy and a brand new Samsung 840 SSD.  Whoa, nerdgasm.

I doubt my Asus is running the SSD at SATA3 transfer rates, but damn this thing is fast.  It definitely feels like my computer is running at double the horsepower, but I only spent $200 for all the upgrades.  Here's hoping this laptop will run me through the end of college.

On a side note, I changed up a bit of the Ryu theme.  I really wasn't digging the widget buttons at the top, so I scattered those menus among my page.  I've yet to make all of the CSS updates I want, but this is a good start.. WordPress, success!

Standard
Design, Programming

Switched from Rails to WordPress for CMS

I was screwing around with the Refinery gem for the first half of today, and I kept wondering why everything seemed so outdated -- why the hell is it so ugly??  The last blogging gem available for Rails, Mephisto, was updated 4 years ago...  Needless to say, I didn't want to craft my own content management system or use any of the gem alternatives for my blog application.

So here I am, and I must say WordPress is light years ahead of its competition (I'm looking at you Joomla).  I love the ability to quick install plugins and customize all of the content of the fly.  The flexibility of this CMS reminds me a bit of Drupal, but much more intuitive.  Moreover, I've finally found a use for the GoDaddy Linux server that I regretfully paid for a year's worth of hosting, but more on that later.

The only gripe I have against WordPress -- and it's not even the company's fault -- is how many people have used the default themes!!  Just browsing the first few pages of themes, I realize that multitudes of websites haven't even touched the CSS.  Rather, they apply the default theme and hope that no one else uses the same theme...

For now, I'm going to see how enjoyable this WordPress system can be. Stay tuned for design updates!!

Standard