A Friendly Company
Aligned responsibilities with the Science Fiction author Isaac Asimov’s Laws of Robotics. This allows them to serve with distinction and patience.
Scary friendly
Hi! tech
Hi! tech
The Origin
Hi! tech has been in my imagination for a long time, perhaps over a decade. Visually, probably like most designers, I was fascinated by the balance of the a lower case ‘I’ and an exclamation mark ‘!’; like this: i!. I wanted to use that somehow, but also provide visual emphasis for the long ‘I’ sound that would come from an exclamation. I was also not so egotistical as to create an identity such as I! because it seemed so prideful. It needed to be friendlier than that, hence I began to play with the word ‘Hi’ and with an exclamation in a friendly manner. ‘Hi!’ was then born… But what else to marry it with?
The Show and the Company
I watch a lot of documentaries, and love a good voice over. I fancied I could create a show explaining more esoteric or elaborate computer science and technologies at the root of very modern, or soon to be available products. With an attitude that also strayed to education, and an obnoxious love of puns and plays on words, I named this show (in my sketchbook, anyway) Hi! tech. The premise being it presented various complex or ‘high’ technologies in a friendly, accessible, and above all understandable, technologies.
There was even a short story I developed behind what happened after the show went off the air. The hosts and producers stayed active in the tech fields and eventually had an epiphany that they could provide relatable technology support and assistance to society. Hi! tech, the company, was founded on this idea. The company would be human-centric, providing products and services to help certain demographics better navigate the digital world. The company is Geek Squad like, but stands behind a powerful philosophy and ethos of being civil and friendly. A privately owned co-op, they earn in the service to others. Whether one selects hourly, per diem, or even year-long plans of any services friendliness is key.
Technology Extends the Alien Hand of Friendship
The word Hi! in the logo was developed from standard letterforms, but tweaked to be bubbly and soft yet still retain formal principles. The word also needed to be able to stand out from ‘tech’ at all times. ‘tech’ is very much part of the company’s full identity name, but emphasis is always on Hi!. In fact I over did it, and threw a glossy, candy coating over the final idea to see if that helped approachability (might not be a word). It didn’t, and looked obnoxious.
Candy coated so you know it’s legit friendly.
While the full name is ‘Hi! tech’, the style guide dictates that most often, just the hand can be visible.
I wanted a single point reference for attention that was encompassing of the ethos and the company’s ties to technology. It needed to be iconic, but also reflect a weird abstractness that is the alienation some individuals feel about technologies they don’t understand. The combination mark of the ‘Hi!’ in the hand does this rather well, I think. With ‘tech’ existing either to the right or below, the whole company’s identity can exist in a very stable environment. Also, the word ‘Hi!’ triggered various obvious references from hailing someone at a distance to waving, as well as ‘high fives’ and the general friendliness understood when one displays an open palm.
The ‘alien’ nature of the hand came about but drawing on the other reference derived from the second word in the company’s name, ‘tech’. Each finger is from tip to palm is inspired by the solder points of a regular circuit board. Often times, many of these converge to a single point on the board, and this idea became the palm. With all of the above operating, a weird, but uniquely unthreatening combination mark was born.
Circuit board aesthetics, I think, could be a style all their own.
Green Means Go
Colors were a fairly simple. In western culture, at least, green is an accessible color. It means you are welcome, allowed, or able to do or achieve something without explicit permission. In fact, green operates as that permission so one can receive visual confirmation as opposed to seeking out a verbal acquiescence. Most greens I tried fell on the blue side, but there were pretty unwelcoming in consideration, so I landed on a warmer, yellower green in the end. Warmer colors are more secure, welcoming, etc. to a certain point. I’ve always found green tricky, though, to compliment without the other color becoming more dominant. Thus, the light grey was decided on as well as white. Three core colors in the identity became a guiding factor in the website, then as well.
The wave
This is a screen recording of a CSS animation turned into a .gif. Figure that irony out.
As I’ve mentioned in other descriptions, I actively pursue pushing my skill boundaries. I’m really good with HTML5/CSS3, but hadn’t played much with CSS animations. Part of the idea of the identity was the motion of waving hello in a soft, almost royal, manner. Also, Flash is suffering ill repute , and I also wanted to make an animation that was pretty lean and low bandwidth. So then, a CSS animation was the challenge. An animated gif would be too easy, of course.
The Website
As designed previously, before responsive design became the approach du jour, the site was unique because it took a ‘single page’ approach, but in 2 columns. One side was purely products and services and the other was informational material of technologies covered perhaps on the fictional show. The 3 controls on the right navigated the right column, and so to the 3 on the left controlled the left column.
The old website was too traditional. After all, it was designed in 2006 or so.
Since I purchased the domain ‘thisishitech.com’ some time ago, I had this old design to reference when it came to developing the new one. I jumped on the new design in an effort to take myself through a rigid, self-guided version of a standard web design process. The new site would reflect the same ‘one page’ approach as before, but would take advantage of modern javascript/Jquery and css transitions. Above all the site would be responsive, and I set about designing wireframes. [new hitech wireframes]
I usually make 2 wireframes: 1 image and 1 interactive.
Wireframes would be easy, if it weren’t for all the layers.
The fancy wave takes center stage.
The Avuncular
Yes as an app, there’s some lost real estate, but I connection is key. Put a face to a name, as it were.
Here’s a little insight into how my mind churns: Agatha Christie’s Poroit is one of my favorite television adaptations of anything, and in watching ‘The Mystery of the Blue Train’ I thought of first service that helped define the company’s philosophy and ethos: the Avuncular.
The avuncular is an app assisted connection to an employee of hi!tech foley dedicated to you and any technical questions or support you might need. The idea is this person is permanently on call for the purchaser of the service to be their human, tech oriented google. They provide guidance lists which outline approaches to discovering things on your own. This is a service of service that plans its own obsolescence. The idea is the avuncular is best described via the word’s old definition : suggestive of an uncle especially in kindliness or geniality. Avunculars don’t have to be male, though, it is the 21st century after all.
Other Products and Services
As seen in my other independent work, I create plays on words to name fictional products and services. Sometime they even have unique icons, but the names are fun (I think) like: Hi! tech’s SkyHi! Cloud service, or their Hi!Level Security services like encryption and such. Others have fun, but still pertinent, names without self reference: Checkpoint gaming, or Nano, their AI system. Hi!5, if it was real, may be particularly ingenious on concept alone. Hi!5 reduces many complicated apps to just 5: word processing, messaging, scheduling, entertainment/media, and creative (like drawing and photo libraries or editing).
Nano is friendly and cheerful… Probably annoyingly so.
ROUND watch face. I love Apple Watch, but watch faces have to be ROUND. so I designed mine that way.
5 apps! Hi 5! Get it!? Oh, never mind.
Final Thought
I like to think of Hi! tech as not only a design and execution assignment and portfolio piece, but also the growth and change of an identity over about a decade. The idea began as some abstract notion that I might create a tv show, and turned into a very cohesive identity. The identity, guided and reinforced by the ethos and philosophies of friendliness and service, stands as real as anything else out there.
Visit Hi! tech
View More: CSS Animation, Friendliness, Green, Identity, Psychology, Template, Typography