Sunday, September 20, 2009

iPhone, Firefox, Chromium, and the Future of the Web

In the world of software there are really only two paths a chunk of computer code can follow. The first is to live life as an application. The second is to compete in the big leagues as a platform. Applications live on top of other software platforms, typically an operating system of some sort. Applications are things like Microsoft Word for PC and iCal for Mac. Platforms handle all the behind the scenes stuff that makes computers work, so that applications can just do things for the user without having to worry about it. Examples are Microsoft Windows and Ubuntu Linux. However, these days it seems our choices are not so binary any more. In recent years folks have been shouting "The internet is the new platform." They seem to think that everything we do on a computer can be done through an internet connection, without having to install any software on our computers. There are a few problems with this. 1. Microsoft is a big and powerful corporation that makes all its money by being the "gatekeeper" with the most popular platform; Windows. If the internet becomes the new platform, Microsoft looses. Giants in an industry don't go down without a fight. 2. Despite all the claims that high speed internet connections will become ubiquitous, it just isn't going to happen. Private network infrastructures are not going to run cables to towns with only a dozen users, and I don't think most people want the government to subsidize high speed internet to everywhere. 3. The mobile device tsunami is going to overtake wired internet access anyway. Mobile devices are smaller, cheaper, simpler, more available, easier to use, and always on whenever you want to have another look at the map. From a Nokia to an iPhone, these are going to be the majority of clients on the future internet. However, mobile bandwidth is more expensive, and so must be used much more scrupulously. That makes web based applications unsuitable for mobile devices. I think there is something far more interesting going on, and it is not getting any airplay. What if there was a hybrid situation, where half of an application lived on the internet, and the other half lived right in the palm of your hand, in your lap, or on your desktop? Think it's crazy? Just look at the iPhone a little closer. I have a good friend who is building an iPhone app. All the data the app needs, pertaining to it's owner, can be stored on the phone. However, as the user drives down the road, the phone detects it's GPS coordinates, and sends a request to a server somewhere on the internet to get the latest information about highway speed traps in that area, and then warns the user about them. In fact most iPhone apps work this way. The app lives in the palm of your hand, but the database, its backend, lives somewhere in the clouds. Why is the hybrid app so much better? 1. Only raw data is being sent over the cell towers and the wires. This is different than a web app, which must send a full page from a server whenever the user requests a different view or more information. How slow and annoying is Facebook, a web app, compared to any of the iPhone apps, which are mostly hybrid applications. 2. You can use a hybrid app whenever you want, even if you have a slow internet connection, spotty cell signal, or no connection. 3. Having your information on your own device is reassuring. 4. Developers and designers can create more useful, rich, and user friendly software without the technological restrictions imposed by a web app. However, though the iPhone is great, Mozilla and Google have hybrid platforms for netbooks, laptops, and desktop computers. Firefox, Mozilla's popular browser, has a mature and and comprehensive extension system. Extensions to Firefox, or addons as they are often called, make the browser more like a hybrid application platfom than simply a web browser. For Google's part, they are making quick progress on the Chromium project yielding the Chrome web browser, which, as we would expect from Google, has included an extension system similar to, though not as comprehensive as, Firefox. While Apple runs away from the field of hybrid platforms on mobile devices with the iPhone, Chrome and Firefox are quietly establishing themselves as the future of the hybrid platform on laptops, desktops, and netbooks. In fact, Firefox, the far more mature of the two, already has two experimental extensions that are attempting to show off the potential of the hybrid app with Ubiquity and Jetpack. At the Fireworks Project, we want to be a part of hybrid application renaissance. In fact, more than that, we want to help define it. While it is unwise to duplicate the efforts of Google and Mozilla to build the hybrid platform, we can still define how the platform will evolve by creating the code that actually does what they are designing these platforms to do. Enable the user to work freely and quickly, connected or not, and with complete freedom from having their data tied up in some web app in the cloud. I'm currently working frantically on extensions to both Firefox and Chrome that will make building, packaging, and distributing hybrid applications a quick, painless, and profitable process. My goals are:
  • Create a platform for code modules to be installed and imported on the client device.
  • Create a platform for user facing application extensions ("toolpacks") to be installed and executed by the user.
  • Design an environment that encourages the creation of many small tools that do one thing, and do it well. (the Unix philosophy)
  • Allow for portability between Chrome and Firefox.
  • Automatic dependency management for code modules and toolpacks.
  • Use common web technologies like HTML, CSS, and JavaScript.
The running theme is "modular". If we can stay disciplined with the modular approach, we have a very good shot at realizing the full potential of the hybrid online/offline platforms. I'm really excited about what I've done so far on this project, and I can't wait to see it in action. I'll be sure to be posting updates as they come along. Note: People in the know will wonder why I did not include these: Adobe Air Microsoft Silverlight Microsoft Azure Drop a note in the comments, and I'll be happy to explain.

Tuesday, August 25, 2009

Start Programming Quick and Dirty

Warning: This really is a quick and dirty start to computer programming, and if you know anything about software development, I'm sure you will find plenty of defects in my crude descriptions of computing. The point here is to communicate the basic understanding to begin learning without submarining a person's brain with useless detail. If a beginning programmer learns the quick and dirty way, then as their knowledge and interest grows, they can go back and fill in all the little details later. When you are writing computer code, or even just using a computer, it really helps if you keep in mind the three things that make up all computing devices.
  1. The processor.
  2. The memory.
  3. The storage.
These are the building blocks of every computer program and the only things we know for sure that all computing devices have in common. An iPhone, a laptop, or a server; Each of these computers has these three components in common. 1. Processor The processor is a collection of transistors that can do simple computing operations like evaluating if two bytes are equal, or adding two integers together, etc. A processor fetches values from memory, performs operations on them, and then puts them back into memory. 2. Memory System memory is a collection of computer chips that are able to store bits of information while the power is on. As soon as these memory chips lose power, the information is lost. Inside each memory chip there are 'rows' of data, and each 'row' is addressed with a special addressing number. The processor can remember where values are stored in memory using these addresses, but as soon as the power is shut off, it is all gone. 3. Storage The system storage can come in two forms. First is a set of spinning disks called a 'disk drive' and the second is a set of computer chips called 'solid state'. Most desktop and laptop computers have disk drives, while cell phones and memory sticks use solid state. Disk drives can be thought of like a record player, but imagine a record player that could play records and write them too. Solid state storage devices are banks of computer chips that do not lose the information stored in them when they lose power. So how does a programmer link these 3 fundamental computing functions together to make a computer program? We can demonstrate this process with a program called Python. Python is actually a computer programming language, which we will learn more about later. But for now, you should start the Python interpreter in your terminal by simply typing: python and hitting enter. (if you do not know what a 'terminal' is, please post a comment and I'll send you some more detailed instructions. If you type 'python' in you terminal and nothing happens, then you probably need to install it. Some good instructions can be found here: http://diveintopython.org/installing_python/index.html ) You should see something like this on your screen: Python 2.6.2 (release26-maint, Apr 19 2009, 01:56:41) [GCC 4.3.3] on linux2 Type "help", "copyright", "credits" or "license" for more information. >>> The '>>>' is what we will call the Python prompt. Now enter in this program, hitting enter after you have typed in each line: >>> myvar = 1 >>> myOtherVar = 2 >>> mySum = myvar + myOtherVar >>> print myvar >>> print myOtherVar >>> print mySum See what has happened? First we stored a value, the integer 1, in the computer's memory. Remember that each value stored in memory has an address? Well that address would look something like 'f8a9b6' to the computer, which is really hard to remember for humans when we are trying to write a computer program. So, Python does us a favor and remembers that when we refer to 'myvar' we are really referring to the 1 we stored at address 'f8a9b6'. Second we stored another value, this time the integer '2' into memory. Now, if we were to keep adding values to memory without removing any of them we would eventually fill it up and cause our computer to crash. So, the Python interpreter also does something else really useful for us; It can tell when we are done with a value and it will remove unused values from memory so that we can go on with our program without having to remember to remove all our values when we're done with them. Third, we told Python to add the two values together. However, adding two values together is not much fun unless we store the result somewhere in memory so we can use it again. What actually happened here is that the Python interpreter remembered the address in memory pointed to by 'myvar' and 'myOtherVar', and then sent those addresses to the processor along with the instruction to add them together. A processor always does exactly as it is told, and so it fetched the values from their addresses in memory, added them together and put the result back into the memory location that Python pointed to with 'mySum'. Last, we used the 'print' statement of Python to retrieve each of our values from memory and print them out on the screen. Statements like 'print' are just shortcuts for longer instructions to the processor. So instead of saying: >>> send value from memory address at myVar to the graphics card to display We can just say: >>> print myVar or instead of saying: >>> take the value at myInteger and add 1 we can say >>> myInteger++ This is why computer programmers often refer to the terms 'writing code'. Because, all a programming language really is, is a set of statements or verbs that tell the computer to do something. So, instead of writing out long instructions in plain English, each programming language has a list of codes we can use to save time and space. So, that is only half of the story on a programming language. The other half is what is called the interpreter or compiler. We don't need to get into the specifics on each of these but what we do need to know is that the programming language we are writing must be translated out of the code, and into a language the computer can understand. Computers don't understand English, Latin, or even any programming languages for that matter. The only thing that the processor, memory, and storage understand is something called machine-code. Machine-code is written as a series of 1's and 0's like this: 100011 00011 01000 00000 00001 000100 While this is the only thing that a computer understands, it is very hard for humans to read and write, so in the early days of computing some smart folks came up with an answer. They would create an interpreter to translate machine-code into a programming language and vice verse. Today there are many different kinds of interpreters and compilers, one for each of the many different programming languages. Incidentally, an interpreter or compiler is a computer program written in machine code, but the nice thing about them is that once an interpreter or compiler program is completed by the smart people who write them, the rest of us can use it to write our programs in a language a little easier to understand. So, with a basic understanding of what is going on, and the right programming language interpreters in hand, we can tackle larger problems, like designing the interface to our program. There are many ways to do this, but one of the most popular, and the easiest to learn is XML and CSS. We'll move on to those later. At this point, I would encourage you to continue to learn a little more Python, and this is one of my favorite tutorials: Dive Into Python You can skip section 1, but you should thoroughly understand sections 2 and 3.

Monday, June 15, 2009

The Fireworks Project Logo is Done

I'm really excited to be done with our logo. It seems silly, but this is a big milestone for the Fireworks project. We're an open, online company, and we designed this logo using only online collaboration tools. Most of the credit is due to Martin Hipp, who did the lion share of the graphical design work. Why is this significant? Because, if we can learn to design, build, and innovate using online collaboration tools, then we can engage with and share ideas with anyone in the world who has access to an occasional internet connection. Our talent pool then becomes much larger than just the people who work within the 4 walls of a typical brick and mortar organization. So, while a logo is not such a big deal, leaning to design and build something online is a big deal. So what did we learn? Constant communication is key. Use twitter, instant chat, and news groups to leave messages and critique to everyone working on the project. Do this constantly. Nobody should go more than a day without either responding to an ongoing discussion or starting a new one. We didn't do this very well and the project lost momentum whenever we lost contact. When designing it is also very easy to get caught up in a design contest of sorts. This should be avoided, because it is an inefficient use of everyone's time. Instead of trying to create "knock your socks of" designs right out of the gate, the whole team would be better served if each member worked on creating minimal sketches of their ideas. Each sketch should only have enough detail to simply communicate the idea, and nothing more. A sketch could be on any medium, but for graphical design it is often easiest to use the typical computer graphics tools. In general, the guidelines I outlined in a previous post still hold true. Now, with our first project under our belt, I'm really excited to keep moving and learn how to improve our online workflow. Our next project is our website, and you can follow along here.