Archive for August, 2013

h1

Cute internet enabled LED

August 29, 2013

Ok, I’m done. Or done enough.

Thinking of you LED

 

As you can see, I procured a jar and some semi-transparent rocks to diffuse the light. Recently the jar was mistaken for a jar of ice, so that’s what it looks like when it isn’t lit. The webpage looks like it did in the last post. It now posts the sender name as well as the color. I can snoop to see the server log with the sender name but didn’t make a page for the thinkee to see who sent them love when they weren’t looking.

The battery got bigger so that it lasts for about a week with 3-5 events/day. I did switch to a standard LED instead of my I2C LED so the total parts cost is about $70, pricey but it is handmade.

Things I kind of want to add to the project (projects are never finished):

  • Add battery monitoring so it does something when the battery needs charging
  • Add a thinkee page to see who sent love
  • Add an accelerometer so the thinkee can tap and have that get back to the sender
  • Update the Electric Imp to use the beta agent interface so the response is prettier after love is sent
  • I suppose some would say it needs a better container but I find this one quite amusing in its homemadeness.

I thought about selling this on Etsy but, really, I could sell this to a couple real-life people without bothering to learn how to do Etsy.

If I sell it, though, I don’t think I’d build another. I have a different idea. One that matters a more to me. But we’ll talk about that later. Soon.

 

h1

All that I need now is a jar

August 20, 2013

One thing that I didn’t really get before working on my thinking-of-you webpage: all web developers write OpenSource code. Once it is on the web, anyone can read it.

Copyrights are fine but is copying someone else’s method of selecting colors of setting up a form or changing font colors for a section instead of a div really protected? I’m not talking wholesale page stealing, just copying snippets.

I didn’t do anything that I didn’t attribute (or learn from HTML and CSS book I mentioned before). But I did read a few random pages, trying to see how they did this or that. That was kinda neat, looking at how pages are put together, now that I speak a little bit of the language. I understand why so many things are hidden in PHP layers: so no one can see a site’s undergarments.

Usually, my code is seen by one or two other people, during code reviews or when it is reused, not by anyone who cares to look. I don’t think I mind but it is a little odd. I mean, what if there was a better way to do it? On the other hand, I’m such a noob at web dev that I’m sure there is. And if you tell me, I’ll be happy to know. So why am I nervous?

Here it is:

Thinking Of You V1

http://www.logicalelegance.com/portfolio/thinking-of-you-wout-id.html

That won’t actually blink my LED. While it will let you set your name (and color if you don’t like the one it chooses), it will give you an error when you try to send some love to Christopher. (Hey, if I’m going to be working on this, might as well make it my sweetie.)

The response page is ugly, I’m going to ask Electric Imp about making the response prettier. I don’t care too much about the no-id get-error version but the one with the real key just sends back a page with OK in it sans prettifying.

Note that I met most of my goals: it is one page, settings are hidden after you put your name in, the cookie works (though Firebug can’t find it which is a pain for debugging). I also added my stretch feature of changing the button text on reload. That was easier than I expected and it amuses me.

I updated the Electric Imp code so with the right key in the html, I can change the LED. But I’ve decided to use a PWM LED instead of my fancy I2C LED. That shouldn’t take too long (Electric Imp has RGB LED example code). Then I’ll combine it my USB chargeable LiPo, then put it all in a jar with some hotglue.

 

h1

Nothing is ever wasted

August 19, 2013

I showed the thinking-of-you proof-of-concept webpage in the last post about this project. While functional, it was the definition of ugly. I want to make something lovely, that captures the charm of the project.

I have my sketch of what I want to do, it isn’t pretty (or legible to someone who isn’t me).

Web sketch

Here are the highlights:

  • I want the one file to be easily email-able.
  • One file to contain the three apparent pages: initial welcome, sending the (hug? wink? cheer?), and settings page to change name (and color).
  • The unused parts of the page shouldn’t be visible, the user should only see the welcome or normal page. The normal page should have a settings area that can be opened but is usually hidden.
  • The CSS and Javascript shouldn’t be in separate files. (One file, email, see first point.)
  • One file means no images. Off the shelf everything. But it should still look nice.
  • Colors are auto-assigned based on names but the user can still choose their color separately. This is a little complicated.
  • Color and name should be saved as a cookie so the user only does selection of these once.
  • Color and name should be changeable but that should be hidden until settings is selected on the normal page.
  • The color selected should be on the page itself: an icon should change color.

There is only one problem with all of that. It is way more web code than I know how to write. I started to solve this by reading Headfirst CSS and HTML. (I like the Headfirst series, they take longer to read but the information sticks a little better. The trade off is worth it, especially as they are amusing so I tend to keep reading.) I finished this book but I still didn’t know all I wanted to do, in particular the hidden parts of the page, the cookie, and showing the user’s color on the page.

Apparently, some of what I need to create is Javascript. I’m a little baffled as to the breakdown; HTML is the content and structure, CSS provides style, and Javascript does actions based on events. However, HTML5 can do actions based on events too. And none of them are particularly specific about how to deal with cookies, though Javascript seems the best for that so far. (Also Java has nothing to do with Javascript, they just named them that way to screw with my head.)

Yes, I program for a living but I don’t do this. And yes, I’ve made plenty of webpages, but they were either pure HTML (pre-2000) or done with a WYSIWYG editor. Plus, this is (secretly) an application masquerading as a webpage. Since all the cool kids are doing it, I thought it would be easy.

HTML5 (and all its friends) are living, changing standards. The books are out of date as soon as they are printed. Though, if you use a neat new feature, some browsers may not support it. (Goggle eyes in frustration of both never being right-according-to-the-spec and never knowing if I’m wrong-for-the-user’s-browser.)

This is strange to me… C99 (the C standard ratified in 1999) has been around long enough for me to know really well. And yet, Microsoft Visual Studio did not support it until last month. It isn’t that embedded systems move glacially slowly, the processors change quickly and new sensors are always coming out. I’m used to knowing and understanding the tricky parts of my language, it is bedrock to me. The shifting sands of web development are not giving me warm fuzzies.

On the other hand, I’m starting to get Agile development better now. This webpage will never be complete. It is getting better but there will always be something else I want to do. (For example, when you press the “Hug” button, it would be nice if the button changed color for about the same length of time that the widget’s LED will be on that color. That lets me have separate buttons for hug and wink since they’d have different times.) Even though the page isn’t perfect, I should put a line in the sand and say “this is pretty good”. That line would be easier to draw if I knew I could re-draw it in a week or two.

Thinking of you webpage v0

Here is the current version, as seen in Firefox. Some things to note:

  • This is the normal page, after the initial welcome page. My cookie is already set.
  • The turquoise heart is what my name colorizes to; other names would get a different color. I fix it so all colors have to be bright enough. (I’ll post the page next time so you can see your name’s assigned color.)

My list of short term improvements:

  • Hide settings area. I already mostly know how to do that (since I’ve already hidden the initial welcome area).
  • Fix cookie so it is not a session cookie but a permanent one. (Argh!)
  • Fix the color selector to look better in browsers that don’t support the color tag. (Chrome and Opera support color selection; Firefox and iPad do not, those will get a drop down list of colors. Right now you can type in a color but you have to guess what the HTML5 standard is thinking. Or write it in hex.)
  • Make hug and wink do separate things (this requires a little work on the Electric Imp widget as well). Or maybe remove one of them for now. Then I could change the name of the action every time you load the page. Hmm… move that to future features.
  • Do another pass of looking at the fonts and basic CSS to make it look more aesthetically pleasing.

My long term improvements are legion (and growing). They will probably change as I learn more about web development.

Wait a minute, why am I learning about web development? I’m a deeply embedded programmer.

I’ve been focused on getting this project done but I’m quite conscious of the fact that this information, this miniature education in web dev, would have been useful to me two years ago as I worked on an internet enabled fishbowl. (Note: it was not really a fishbowl but, to me, it was something that needed the internet as much as a fishbowl does.)

To connect the fishbowl to your home WiFi, you had to connect your computer (or phone) to the fishbowl’s WiFi network. The fishbowl would serve a page that would let you set your WiFi name (SSID) and password. Then the fishbowl would stop serving a webpage and go talk to the internet using the information you gave it. You’d switch your computer (or phone) and be able to talk to the fishbowl via the internet. Fun for all the fish.

But that webpage that the fishbowl would serve up? That came from the fishbowl’s miniature filesystem. And when we needed to make changes to it, the firmware team would go to the web dev team and ask for changes. They were always busy with the web (plus they spoke webese and we spoke embedded). Things took forever to get done. Well, that’s lame. Now, I could make those changes. I don’t think I’d change aesthetics but I’d be fine with 75% of the tweaks that needed doing.

So, if you think I’m learning web development for my thinking-of-you gadget, that is correct. But there is more to it than that. I hate the phrase “Internet of Things”, it oversells the connectivity that is coming. But whatever you call it, there will be more internet enabled fishbowls and now I can do even more for them.

Here fishy, fishy.

 

h1

Blah blah blah

August 12, 2013

Everyone needs ways of talking about themselves. And many people  says “I’m <name> blah blah blah” in their own heads because we don’t really like to talk about ourselves to ourselves.

On the other hand, you need to practice your personal introduction so you don’t end up vocalizing something that sounds like “blah blah blah” to the other person.

I’ve got my twitter self-description:

I’ve made DNA scanners, inertial boxes for airplanes and racecars, children’s toys, a gunshot location system and other neat gadgets. Oh, and I wrote a book!

Which then links to my book. This is my basic go-to introduction in a networking context (not that I quote it, it provides the highlights of what I say when meeting someone new). People often want to hear more about one of my past projects, so it starts a conversation. Plus I give the other person the option to choose the conversation path while still talking about *me*.

Ok, that last bit is terrible. Conversations do not need to revolve around me. Though, if my intro lets a conversation start that way for a minute, that’s ok. My followup question back to them is either a request for info about them or a query as to why they are interested in whatever path we’ve gone down.

See, the goal is to have an introduction that starts a conversation. Like a chess game, it is the opening gambit. Plus, I’ve given myself a plan for dealing with whatever move they make. Hopefully after we’ve each moved twice, the conversation is in play and we can stop with these silly games, get to real connections.

I’ve been thinking about this today because I’ve been writing other introductions to myself.

I wrote Making Embedded Systems for O’Reilly. I have shipped dozens of projects from DNA scanners to children’s toys to FAA certified airplane system. I have made many simple embedded systems (so many projects seem to be LEGO blocks: processor, sensor, some software algorithms, connect to USB, Bluetooth or WiFi, etc.). I also enjoy projects with more complicated math (signal processing, machine learning, control loops). For example, I worked at ShotSpotter, identifying gunshots in the midst of busy city soundscapes. I’ve been an engineer, a manager, and a director.  While the others roles were interesting and rewarding, I prefer engineering. I am founder of Logical Elegance, a consulting company focusing on embedded software.

I wrote that as an introduction to a company that I’d like a contract with. I didn’t want to just send my resume as I hate getting cold calls. I think this describes my skills and personality without taking all day. It may need to be broken into paragraphs but I didn’t for that email.

I had to write a section on a form, 1000 characters of “achievements” so I took the above email-description, made a few tweaks and wondered what else made me who I am. So I added this at the end:

I’m easily amused but care deeply about the application and users of the products I work on.

It isn’t exactly an “achievement” but it fits (to me).

In the same form, I had to write a linkedin-like 300 character description “what I do” so here is what I came up with.

I write software for things that aren’t computers, whether you call that firmware or embedded software. I like the little processors, dealing with their RAM, ROM, cycle, power constraints. I design and implement system architectures.

These forms are tough because I want to keep saying the same thing over and over again. I have to work to find a different spin. Ideally, something that will make the person reading it contact me to work on something neat. 

I wonder if I should change my LinkedIn profile. Let’s see… yes, it is getting a little stale:

My goal is to make interesting gizmos that make the world a better place.

I have deep experience in embedded systems and signal processing over a broad range of applications: a gunshot location system, educational toys, inertial measurement in race cars and airplanes; and a DNA scanner.

I am interested in solving big picture problems, producing quality designs and implementation, and delivering excellent technology products.

I can help you with signal processing, hardware/software intersections, complex system problems and resource constrained systems.

All this and management and mentoring experience.

Specialties: Embedded systems!

Preferred languages: C/C++, Matlab, some assembly, some python

And then it goes into acronym bingo with processors that is annoyingly out of date. And that “Specialties” line needs to go. I’m glad I wrote my new intros without looking at this. It sounds too sell-y to me know. What was I thinking?

Well, I kinda merged my new one with my old one. You should be able to see it on my public profile.

 

h1

Still thinking of you

August 6, 2013

Having a project made me quit playing with my Electric Imp and start getting to work with it. The Squirrel language taunted me for awhile but, happily, I got some help from Matt, my podcast guest, and things went well after that.

Now, when I set a color (RGB) value to a webpage, it sends the data to electric imp’s servers which sends the data to my board and, poof, the widget turns the right color.

Here is how that webpage looks:

How not to make a website

 

Ummm… yeah. Maybe not so beautiful. I’ve made many websites. But I haven’t done any in years so I don’t know where to start. Asking Google leads to a multitude of slightly terrifying, scammy results. Logical Elegance was done in a mac-based program by Christopher. I think it is beautiful but overkill for what I want. If someone asked me how a non-tech person should make a website, I’d point them to squarespace (which I use for the podcast site).

But I don’t want a website, I want just a page. Then when you want people to (wink? tap? ping?) your light, you email them the page and they use that. I don’t want to host yet another website. And since I don’t need to, a standalone page makes sense.

I suppose I want the page to be pretty simple. I don’t think people should put in the color, they should put in their name (use a cookie to save it). The name should transmogrify to a color automatically, though the user should be able to choose another color if they want (probably from a color wheel, [note: another cookie]).

So I’ll sketch this out on paper (storyboarding is critical) and then I’ll find a tool. Maybe I’ll do it in squarespace for the easy editing and then look at the html to help me figure it out. Or maybe I’ll use my Safari Online to find a relevant book.

But there is more. Once the webpage is unutterably lovely, what happens next?

I think I want to build a small number of these. Let’s say one to five. I’m using off the shelf parts and do not want to spin a board myself. This is a craft project. I’m putting a bit of work in to make it cute but then I’ll be done. Like a scarf.

Though I’ve wandered away from a scarf because, hey, I don’t know how to knit. Also, it needs to connect to one WiFi to get the info, a scarf moves around too much.

In thinking about how to package it, I started wondering about making it a hanging ornament. And I started wondering how to sell it. Happily, the answer came from the same place: in a jar on Etsy. (I was searching for Etsy and electronics to see if they have a no-electronics policy: nope.)

I know Etsy isn’t where you think of when selling or buying electronic products. But if I think about this a a hobby/craft project, it makes sense. I’d be quite happy to recoup my losses, I don’t need to make money on this. I wonder how much I’d need to sell it for. Hmmm… 

Then I’d need a jar ($2) and I’d need to cut a hole for a mini-USB header (for charging the battery) and one showing the edge of the Electric Imp (needed to program its WiFi). I might add some plastic baffle-bits so you didn’t see the electronics, only the warm glow of the LED. Though, maybe I’d leave it looking techy, depends on if it looks nice. Total that all up, I’d need to charge $75 to clear my costs (assuming the expensive LED).

(Mental note: widget should blink white once every hour when the battery starts to get low. Or maybe the Electric Imp agent should email the owner to let them know.)

 

I guess the website and the battery are the two big tasks left to do. The battery has me a little worried; it doesn’t seem like there are any LEGO-like blocks to put together that will work. I woke up thinking about that and how someone should already have made such a board. But all the ones I found aren’t quite the right voltage for an Imp.

Anyway, I’m not there yet. No need to borrow against future problems. I can play in the space of getting things done and dreaming about solutions.