Mac smiley faces, pixel fonts, Microsoft Solitaire… How powerful are Apple’s first-generation designers?

A computer that will "Say Hello" with you is not new in 2021, but in 1984 when the personal computer was still dominated by the code command line, a smiling face and intuitive graphics and text could be seen on the screen , It is definitely a different kind of product.

▲ Picture from: Anthony Boyd

Apple's first-generation Macintosh computer was the most typical representative at the time.

▲ Show footage of the 1984 Macintosh conference

Looking back at the video of the press conference that year, when Jobs pulled out the floppy disk from his jacket pocket and inserted it into the computer, the big screen immediately began to show the system interface-graphics software, spreadsheets, chess games, different fonts, and even one Jobs' own pixel map.

▲ Apple’s advertisement for Macintosh computers

All the interfaces are intuitive and visible. With the mouse, you can tap the icon lightly, and you can quickly get the functions you want without having to enter boring code commands.

As Jobs said, a graphical interface, a screen capable of displaying bitmaps, represents the future of the computer industry.

▲Susan Kare, one of Apple’s earliest designers

But what we are going to talk about today is not the computer itself or the past of Jobs, but the designer behind these interfaces, icons and fonts: Susan Kare. Within Apple, she is also known as the "mother of icons."

Smiling Mac

Many people think that the release of Macintosh computers opened the era of computer graphical interfaces, but in fact, in 1983, Jobs, who returned from "stealing his teacher" from Xerox, had already applied some of his achievements to Apple Lisa.

▲ Lisa is Apple’s first personal computer with a graphical interface

However, Lisa's system interface was still very rudimentary at the time and did not impress the public. In addition, many designs were borrowed from Xerox, and even the fonts were not their own, which obviously did not meet the results that Jobs wanted to pursue.

▲ The core member of the first generation Macintosh development team, the third from the left in the back row is Andy Hertzfield

In order to break the status quo, the core member of the Macintosh development team Andy Hertzfeld (Andy Hertzfeld) began to seek foreign aid, at this time he thought of his high school classmate, that is, Susan Carre.

At this time, Carley had just graduated from New York University. Because she majored in fine arts and had some experience in graphic design, Hertzfeld hoped that she would join in and do some system visual design for Macintosh computers.

▲ Apple II computer listed in 1977

In return, Hertzfeld would give her an Apple II computer worth two thousand dollars, and Carley agreed immediately, expressing his willingness to participate in the Apple project as a part-timer.

In that era, computer graphics design was not yet a system, and even Apple had not developed a complete set of design tools. In desperation, Hertzfeld had to ask Carly to buy a grid notebook for a few dollars, hand-paint the icons, and then let the engineer transform it into a dot matrix icon.

▲ Since there is no special drawing software, Carre can only draw icons on grid paper first

The "cut" and "paste" functions in the first generation of Macintosh computer systems were born on these grid papers. They corresponded to the scissor hand and finger patterns, and the brush was used in Apple's In the drawing software MacPaint.

▲ The icon drawn by Carley on grid paper and the corresponding electronic version

Carre also hand-painted a bomb design, if the user sees it on a Macintosh computer, it proves that he has encountered a "crash".

▲ This classic Macintosh computer promotional image, the "hello" on the screen is drawn with MacPaint

By 1983, Carre changed from a part-time job to a full-time Apple employee, and his main job was to participate in the design of the Macintosh man-machine interface. At this time, Apple's drawing software MacPaint has also been completed, allowing Carre to create bitmap icons directly on the computer.

▲ Various icons designed by Carley for Apple. Picture from: Susan Kare

Many classic icons also appeared at this stage. For example, a wastebasket for storing deleted files, a folded corner of paper, a watch symbol for prompting "Loading", and the "Command" function key on an Apple keyboard.

▲ Now some icons in the Mac system still continue the style of the year. Picture from: Susan Kare Exhibition

Although they are just simple pixel maps, they are more intuitive, and they all have functional metaphors that people can understand at a glance. This also allows Carre to gain Jobs's approval.

So far, there are still quite a few icons, which can be seen in the Mac system.

But if you want to talk about the most well-known design, it should be this "Happy Mac" with a smiley face.

▲ A smiling Mac will appear when the Macintosh computer is turned on

When you start the Macintosh computer, you can see a computer smiling at you.

▲ The two-sided smiley face icon applied to the "Finder", and later iterated several versions. The picture below is a draft of Picasso's two-sided person

There is another style of smiling faces that we know well, that is, a double-faced person. Some people say that its design is inspired by the double-faced villain in DC comics, but more people think that it is actually a restoration of Picasso's paintings.

Now, we can still see the existence of smiling faces of double-sided people on the "Finder" icon in the macOS system.

Over time, the Mac smiley face and its derivative expressions have also been used on other Apple hardware, and have gradually evolved into a concrete representation of Apple culture.

▲The opposite of "Happy Mac" is "Sad Mac", after which the iPod also applied this design

For example, in the early iPod, if the player crashed, a "Sad iPod" pattern would appear, similar to the "Sad Mac" that appeared after a Macintosh computer hardware failure.

▲ The smiling face of Face ID is also derived from the design of the year

The one we have the most contact with today should be the recognition map in the Face ID setting item, which also uses the outline of a smiling face. This is also the highest-resolution "Happy Mac" smiling face picture so far.

Beautiful font and cow dog

When Jobs was still at Reed College, he attended many calligraphy classes, which also made him love all kinds of serifs and sans-serif fonts.

In order to make use of the graphical interface of the Macintosh computer, and cooperate with the printer to print exquisite fonts, Carley designed several fonts for the first generation of Macintosh computers at the request of Jobs, so that users no longer have a single select.

In addition, Carre is also responsible for the system interface layout. Thanks to technological advancements, the kerning of fonts on Macintosh computers is no longer fixed, but can be adjusted according to the proportions, which allows people to see clearer and more natural text content on the screen.

During the development of the font, an interesting story related to naming also happened.

In the beginning, Carre actually chose the station on the Philadelphia train line to name the font, but then Jobs changed it to a world-renowned big city because he felt that "people can remember".

▲ The font designed by Susan Carley for Apple, and the style under different font sizes

Because of this, the names of the Apple fonts we see now are all in this style: Chicago (Chicago), New York (New York), Geneva (Geneva), San Francisco (San Francisco) and Monaco (Monaco), and each font All have different application scenarios.

▲ The control panel of the early Macintosh computer system, as well as the later iPod, all applied the Chicage font

For example, from 1984 to 1997, all the interfaces and dialog boxes of the Macintosh computer system used Chicago as the default font, and it also appeared on the iPod player.

▲ Comparison of Geneva and Chicago fonts, the former will be thinner, mainly used in smaller interfaces such as folder names

But on some small interfaces, such as the folder name, the Geneva font is used, which is modified by Carre based on the classic sans serif Helvetica.

▲ The picture above is the old version designed by Carre, the picture below is the new version in 2019

New York, is the dot-matrix serif font of the early Macintosh system. In 2019, Apple also released a new version of the same name for developers to use for free on the Apple platform. This move is also seen as a tribute to the font designed by Carre.

▲ Monaco font is loved by many programmers

Monaco, is a sans serif monospace font, developers should be familiar with it. Because of its clear and highly recognizable font, it was the default font of Apple's development tool Xcode, and was later replaced by Menlo font.

▲ Old San Francisco font designed by Carre

Finally, there is San Francisco, which is a font designed in the style of Carre's analog cut-and-paste, which is like cutting headlines from a newspaper and putting them together, but it also appeared in Apple's early internal leaflets and posters.

▲ New version of San Francisco font for Apple Watch

In 2014, Apple also released a new version of the San Francisco font, mainly designed for the small screen of the Apple Watch. The style is completely different, but it is easy to read.

It can be said that the appearance of various beautiful fonts has added a different style to the graphical interface of Macintosh computers. You can choose Chicago, which represents modernism, or return to the classical and elegant New York. Different people can have different choices.

▲ In the Macintosh promotional materials of the year, the intuitive text editing and printing functions were also highlighted

More importantly, these fonts can also be printed by Apple’s first laser printer LaserWriter, which means that users can directly complete the full set of text entry, editing, and printing tasks on a Macintosh computer, and quickly produce materialized printed matter.

The realization of this workflow also promoted the development of the desktop publishing industry in the future.

▲ Cairo, a mixed font, was originally designed for decoration

In addition, a "mascot" was born among the fonts designed by Carre.

The cause of the incident came from Apple engineer Annette Wagner. She was designing the printing program of the Macintosh system and needed to find a reference for the preview page to help users correctly identify the orientation of the paper.

▲ The puppy is used as a reference in the print preview to identify the paper orientation

She saw a puppy from Carre’s Cairo font, which itself is a kind of mixed font, composed of various graphic symbols. Wagner enlarged it from the original 26×24 pixels to 41×32 pixels, but this change also caused a misunderstanding afterwards.

Someone said that what he saw on the print preview page was not a puppy, but a cow. Later, someone named the "half dog, half cow" creature "Clarus".

▲ Apple’s badges, beer labels, and eggs hidden in the code for "Cow Dog" make it an unofficial mascot

The saying "Clarus, the Dogcow" came into being, and it immediately became one of the myths of the Apple technical team. People use it as a badge, printed on clothes, or as a label name for party beer.

▲ Picture from: 512pixels

In addition, there was an icon garden in Apple's old headquarters, in which a sculpture of a cow and a dog was erected, which shows that Apple employees loved this strange creature at that time.

Friendly design

In 1986, Carre left Apple with Jobs and became the No. 10 employee of NeXT as a creative director. At that time, she introduced another well-known designer Paul Rand to Jobs to design the logo for NeXT.

▲ Carre, who is the creative director of NeXT. Image source: Stanford University

After that, Jobs returned to Apple, but Carley did not return to his old club. She found that she still missed the time of drawing pixel maps and doing design, and then decided to become an independent designer and founded her own design company Susan Kare Design.

▲ A small sticker designed by Carley for Path and Facebook

With years of design experience accumulated by Apple, Carley received many design commissions after flying solo, including orders from major companies such as Microsoft, IBM, and FaceBook.

The most well-known of them should be the card surface designed by Carley for Windows systems.

▲ The earliest Windows card game, the card surface was designed by Carley

In 1990, Microsoft began to build card games in the Windows 3.0 system, and the first batch of card cards were drawn by Carley on an IBM PC.

At that time, Carley directly used the drawing software that came with Windows and the traditional 16-color VGA palette to restore the real-world playing cards on the screen in the form of pixelation.

Carre said that until today, the source files of these cards are still stored on a 5.25 inch floppy disk.

▲ Substantiated pixel style playing cards

At the node of the 25th anniversary of the birth of Microsoft Solitaire, Carre also cooperated with the design brand Areaware to complement the two aces that did not exist in Windows, make up a complete poker, and launch a physical version of the pixel card.

Many designers believe that Susan Carre’s design is simple, friendly and very friendly. She established a new image for Apple Computer, and gave it a personal aspect, which transformed the computer from an era when there were only cursors and boring codes to a product that even 3-year-olds would like to use.

Just like this Happy Mac pattern. According to Carre's recollection , she hoped to inject a positive and friendly image into the Macintosh with a smile, which was in line with Jobs' goal of "making a product with a friendly appearance."

Because only in this way can boring computers truly attract mass users.

On the other hand, Carre's simple design style also meets Jobs' aesthetic requirements.

She once said that an excellent icon is actually similar to a traffic sign. It only displays necessary information without adding extra details.

▲ It is reported that this logo originated from the Borgholm castle in Sweden, and its top view is a "⌘" design

This is the case with the "Command" function key on Mac. Carre found a circle symbol "⌘" from the logo dictionary, which was printed above the key letters. In some Nordic countries, such as Sweden, this symbol also refers to scenic spots, historical sites.

In 2000, Carre also talked about the "metaphorical design" of the icon in an interview. She believes that an excellent icon can be recognized immediately-such as "copy", "undo" and other abstract functions, even if the user has never seen it, it can be understood from the visual icon, which also makes She designed a number of highly recognizable icons for the Macintosh.

Today, Susan Carre serves as the creative director of Pinterest and also opened a personal website , which retains most of her past design works, while the manuscripts are kept in the Museum of Modern Art in New York.

In May of last year, she also helped a puzzle company Magic Puzzle to design a logo, which also included smiling faces.

Perhaps, Carre’s icon design is like a little surprise, seemingly simple, but once you read it, it will be deeply imprinted in your mind.

I hope that in the days to come, we can see more simple and friendly designs like "Happy Mac" on Apple products.

#Welcome to follow Aifaner's official WeChat account: Aifaner (WeChat ID: ifanr), more exciting content will be provided to you as soon as possible.

Ai Faner | Original link · View comments · Sina Weibo