Monday, February 28, 2011

Website Design

The company I work for needed a new website.  I’m not a web designer, but I can piecemeal my way through a bunch of different programming languages.

The existing site had three major issues:
  1. The graphic design focused on PC boards.  We don’t make PC boards.
  2. The aesthetics were dated and the copy was vague.  For example, the home page didn’t describe what APSessco does.
  3. The products page was incomplete, provided no specifications, and even had some stuff that (to my knowledge) we’ve never done.
A proper project starts with requirements, so I wrote up a Request for Proposals and distributed it to some designers.

The RFP briefly described the company, existing conditions, and desired outcomes of the website redesign.  Cost was unfortunately prohibitive, so I ended up doing the new website myself.  I had to plan out what graphics to use, how to size them, and where to put them.  So, I made a quick site map and some pencil/paper concept sketches.  I compiled relevant images from old pictures, our library of 3D designs, and even took a few photos myself.

Using GNU Image Manipulation Program (GIMP), I cleaned up the photos by adjusting the lighting, cropping, and resizing them for use on the website.  All-in-all I made about two dozen files for use throughout the site.
Writing copy was probably the most painstaking part.  Normally a designer would just use Lorem Ipsum placeholder and have the client fill it in later.  In the case of doing it myself in a small business, I started from scratch describing the company’s history and business activities.  No one had comprehensively made descriptions and specifications of products, so I had to scrounge up and compile information.

Hardcore designers will code the pages from scratch.  This gives full control over the content but adds a lot of man hours.  Yuppies will use drag and drop editors for a what-you-see-is-what-you-get effect.  The end product usually looks pretty nice, but most of the time the code is bloated and unreadable.  I chose to go somewhere in between with a template.  Minimalistic-design had one that I liked a lot for the color palette and clean layout.

Editing in my copy and graphics was pretty straightforward.  I just used some formatting tags.  I did have to modify some of the template graphics to incorporate styling specific to the company.  There was a little hiccup where I had to brute force a table to get things to line up properly.  A quick Google search showed me how to set one up.  I stitched all the pages together in accordance with my site map.

I tested the pages for compatibility in IE, Firefox, and Chrome.  I used WinSCP to push everything onto our remote server using FTP.  Voila.  Start to finish was about 40 man hours.  The new site meets all the requirements I set out in the RFP.

Friday, February 4, 2011

CNC Machining

This is a play-by-play of Computer Numerical Control (CNC) Machining on a vertical turret mill.  I wrote this post mainly for the students of FRC 1351, so they could see how their designs get fabricated.  The important lesson to take away is the noteworthy amount of preparation and setup involved.  CNCs are not magic boxes that take CAD files and churn out product.  Remember to thank your machinist for their hard work, especially if they donate their services free of charge to your student group.

The particulars of this article are for an open 3-axis mill.  The steps are essentially the same for even the fanciest enclosed 5-axis mills.  The only differences are the frequency of operations and cutting speed.

Step 1: Engineering Drawings
As a designer, it's hard to believe that someone can't just read your mind and figure out what you want </sarcasm>.  The prevalence of 3D Computer Aided Design (CAD) makes parts look a lot closer to being done than they really are.  2D drawings are easy to overlook, especially when there's a perfect simulation hovering on your screen.  However, drawings have been (and will continue to be) used for decades as reference for specifications.  If there is a discrepancy between your 3D model and a note on the 2D engineering drawing, the drawing takes precedence.  The most common error is to omit hole locations and types.  In the business world, liability is everything.  If you send a verbal idea or hand sketch to a shop for fabrication, you are at the mercy of the drafter who sketches your part into usable files.  If you send an incomplete or erroneous drawing, you will most likely get an incomplete or erroneous part in the mail.

Step 2: Computer Aided Machining (CAM)
Just as CAD software revolutionized the design world, CAM changed the face of machining.  Since the 1980's, CAM code coupled with Numerical Controllers (NC) on machine tools has made the process more precise and repeatable.  This is a screenshot from a CAM program with a graphical interface.  The actual code is a line-by-line series of coordinates and instructions for the mill.  The machinist programs which tools will be used, where they will cut, how they will cut, and how often they will be called.

Step 3: Material
Hopefully your shop drawing indicated what material the part is made from.  If not, you'll have a machinist on the phone with some questions.  Aluminum alloys are the most prevalent general purpose material.  6061 Alloy is durable, light, corrosion resistant, and machinable.  Appropriate starting stock is selected such that there is excess material beyond the part's dimensions.  Machining cuts material away instead of building it up like molding or rapid prototyping.  Also, there has to be enough material to clamp in the vise during milling.  Otherwise, the force of cutting will fling the work out like a bullet.  "Work" is how machinists refer to "the thing we are cutting."  Always wear adequate personal protective equipment.

Step 4: Sizing
Rough cutting sizes stock down to manageable portions.  By cutting a bar into approximately sized pieces, we also conserve material.  Say, for example, we are trying to machine a piece that is 1 cubic inch in volume.  We could pull a 10 cubic inch stock piece from the shelf, but then we'd have to machine away 9 cubic inches--consuming lots of time and energy.  If we rough cut our stock to 1.5 cubic inches, we save on machining and run time.

Step 5: Debur
I frequently mention the vise that holds the part during cutting (yes, the one that keeps the metal from flying away like a bullet).  This is not it.  However, smoothing the edges from the rough cut ensures that we clamp securely and evenly.  A light touch with the grinding wheel makes quick work of any rough edges.

Step 6: Numerical Control (NC)
Now that we have material suitable for machining, it's time to set up the mill.  We start by sending the CAM code to the mill's on-board computer.

Step 7: Zeroing
CNC is based on the progression of servos.  The CNC can move the cutting tool in any direction along its axes within 0.0005".  The CAM code dictates how far and deep to cut.  But, it has to know where to start.  Imagine if you wanted to cut 4.000" across and 0.125" deep.  The CAM code takes care of this.  Now imagine if you forgot to set the origin (0,0,0 coordinate) and it just started cutting thin air instead of your material--not very useful.

All of the tools in the program will share a common X,Y origin.  However, each tool is unique in shape and size.  The required X and Y offset is programmed in CAM based on the tool diameter.  The Z height must be calibrated for each tool (since some are longer than others)

An edgefinder provides a visual cue when it touches the edge of the work.  X and Y are set based on feedback from the edgefinder.  Z is set by establishing a reference point (usually the first tool), then offsetting each subsequent tool depending on it's difference from the reference.

Step 8: Planing
The world is imperfect (by engineering standards.  Philosophers and theists will disagree).  Stock material and machine tools are also imperfect.  By slicing a thin layer from the top of the work, we create a level work plane for this particular set up.  Even if we aren't perpendicular to the Earth, flycutting ensures we are aligned to our vise and our part.

Step 9: Drilling
Note how shiny and flat (planar) the work is after flycutting.  This allows our next tool (typically any drills) to have an even work surface.  Twist drills make quick holes, but are not as accurate as reamers or bores.  Depending on the required precision, a machinist may start with a drill and finish with a better cutter.

Step 10: Milling!
Now we're at the process for which the machine is named.  An end mill is a rotary cutter with flutes (blades) on its bottom face and cutting elements on its sides.  This allows the mill to slice both up and down and side to side.  They come in many shapes and sizes.

I mentioned an enclosed 5 axis mill.  It's exactly what it sounds like.  There's a housing around the entire machine so it can be flooded with coolant, and the cutting head can twist in addition to sliding.  The primary benefit of enclosed mills are the tool carriages.  The one pictured below contains 24 collets, which can be swapped in and out automatically.  The open mill pictured throughout this article needs an operator to swap out tools.

After the program has run it's course, you end up with a piece that's beginning to look a lot like Christmas the engineering drawing.

Machining is by no means a quick process.  Most of the tools travel at 4 linear inches per minute (IPM) or less.  To reduce chatter and improve tool life, most cuts are made in multiple shallow passes rather than one deep one.  The piece pictured above took about 30 minutes to run (not including preparation and setup time).  Even the best and biggest mills only travel at about 10 IPM.  I programmed two pieces at a time to save on tool changes and other setup time.

(FYI thats 3AM.  You're welcome.)  You will eventually wind up with a nice array of parts.  Job well done.

Just kidding.  Remember how we left material hanging over so the vise could grab it and the work wouldn't fly away like a bullet?  Well, we have to cut it off now.

Measuring and flycutting to the right thickness will take off the excess material.

No more tab.  At this point we would run another setup, if applicable.  Keep in mind we only had access to one face of the part.  If there were features on opposing faces, we would have to turn the work and repeat steps 6-10.  This particular part had a channel on one face and countersinks opposite.  I repeated steps 6-10.

Step 11: Review
A quick check for dimensional accuracy.

If the parts are out of spec and can't be repaired, they go to the garbage (recycle).  There are many reasons a machined part may be inaccurate.  Chatter from poor clamping, dull tools, or programming errors are some of the more common ones.

Step 12: Finishing
Finishing up the parts by tapping holes and deburring edges is an important step.  Not only does it make a good impression on the customer, it completes the features called out on the engineering drawing.

Step 13: "When in doubt, ship it out!"
More seriously, one would redo or repair any errors before shipping.

Voila!  The parts are made to within specified parameters.  This concludes machining.

Horizon 2035

I volunteered on a fifteen person committee that worked with city staff and consultants to analyze, review, and revise Sunnyvale's Land Use and Transportation Element of the General Plan.  A fellow member dubbed us the "Big Binder Committee" for obvious reasons.  The process entailed  education pieces on current conditions and proposed changes within the city.  I also worked on a sub-committee to refine the city's first Climate Action Plan.  The scope of our work extends to 2035, but some measures are intended for 2050.

I'm not surprised if a one paragraph blurb doesn't adequately explain what my role on the committee is.  I believe my official title is "Staff Advisory Committee Member."  It was an eighteen month process, so the work was pretty substantial.  Each meeting was a wealth of new information that, quite honestly, took me a while to process.  Urban Planning is a different beast than engineering.

I genuinely enjoyed the time I spent with the committee.  The differences in opinion exposed me to more food for thought than I anticipated, but that was part of the fun.

More information can be found on the Horizon 2035 Website.

Automated Pen Fixture

This is an automated fixture I developed at APSessco Medical, Inc. for MDM West 2011.  It draws a 2" square on a piece of paper using a ball point pen.

 Inserting a business card into the receiver trips an optical detector.


A programmable logic controller kicks in to sequentially energize the solenoid valves controlling five pneumatic actuators.

The device clamps onto the grip of the pen, plunges onto the postcard, draws a 2" square, drops the business card into the collector, extends up, and releases the pen.