Design & Tech Blog – IRISHGUY Design Studio

October 9, 2015August 20, 2018

Website Design for Devices

Website Design for Smartphones by Gary Crossey Asheville

[columns] [span6]

You can no longer think about website design with considering website design for smartphone users. The adoption rate of people accessing website content via their smartphones is HUGE!

Website Design for SmartPhone Users

The one thing people like better than their smartphone has something to do on with their smartphone. There is no denying it Smartphone users are accessing web content, at an alarming rate.

What are the SEO reporting?

During recently web site traffic reports for my clients. Most of the popular sites are reporting smartphone access rates to be between 53% – 65%. With online trends indicating an increased spending rate with Smartphone users.

How the same site content loads on different devices?

With so many different devices on the market. And people using a broad range of various devices to access the web – it may surprise you what your website experience for each user.

The primary objective for Asheville Super Duper Team Computer Training website design was to be user-friendly. The interface and navigation system needed to run successfully on all devices. The core principles of the Super Duper Team Computer Training is to teach people how to improve their skills with computers.

When considering website design for smartphone users you can quickly see even with the different iPhone models how the content loads differently.

Asheville Website Design Example on iPad Users

The same website content accessed via an iPad provides the user with a different layout – and choices. Both in landscape and portrait view the site content is loading in four columns – similar to the experience of someone accessing the web content via a laptop or desktop computer.

On a computer display, the navigation section spreads across the top of the page. On the smartphone, the navigational buttons stack on top of one another.

The iPad and iPad mini website content load the same on both devices.

The website loads slightly differently on the Blackberry device. In portrait mode, the layout exposes a small amount of the first website publication.

The Google Galaxy Nexus appears to load more of the first post than an of the other smartphones. Both the iPad and Computer load the website content in four column, infinite scrolling homepage.

[/span6][span6]

Asheville Website Design Example on iPhone 6

[/span6][/columns]

How does the Website Load on Different Devices?

[columns] [span4]

Asheville Website Design Example on iPhone 3

[/span4][span4]

[/span4][/columns]

June 25, 2015June 9, 2016

BLOG: Logo Design Timeline

How long does it take to build an International brand?

It might surprise you to see the historical timeline of your favorite brands.

<br />
Hope you enjoy the interactive timeline – over time I will add more content to the timeline and informational table. If you would like to add information to the either the table or timeline please email admin@irishguy.us.

Year	Business	Logo	Logo has changed	Name Change	Still in Business
1862	Guinness		6 times. 1st version.		Yes
1865	Olympics	xx	39 times.		Yes
1870	Mitsubishi		Changed 3 times. 1st version.		Yes
1875	Nestle	xx			Yes
1875	Bass	xx			Yes
1876	John Deere	xx	8 times		Yes
1886	Johnson & Johnson	xx			Yes
1887	Coca-Cola	xx	10+ times/		Yes
1892	General Electric	xx			Yes
1896	Prudential	xx			Yes
1898	Michelin	xx			Yes
1900	Shell	xx	7+times.		Yes
1900	Nabisco	xx			Yes
1903	Ford	xx			Yes
1905	Rolls-Royce	xx			Yes
1911	Mercedes-Benz	xx	7+ times		Yes
1926	Greyhound	xx			Yes
1933	London Underground	xx			Yes
1938	Volkswagen	xx	7+ times.		Yes
1943	IEKA	xx			Yes
1951	CSB	xx			Yes
1955	Guinness		6 times. 2nd version.		Yes
1956	NBC	xx			Yes
1960	Chase Manhattan	xx		JP Morgan Chase Bank	Yes
1960	IBM	xx	7+ times.		Yes
1960	International Paper	xx			Yes
1960	Motorola	xx			Yes
1961	UPS	xx			Yes
1961	Weyerhaeuser	xx
1962	McDonald’s	xx			Yes
1962	General Foods	xx		The corporate name was dropped in 1995	No
1964	Mitsubishi		Changed 3 times. 2nd version.		Yes
1965	Mobil	xx		Merged in 1999 with Exxon to form ExxonMobil	Yes
1966	Dinners Club	xx			Yes
1966	Exxon	xx		Merged in 1999 with Mobil to form ExxonMobil	Yes
1967	Westinghouse	xx		Westinghouse Electric Corporation	Yes
1967	Metropolitan Life	xx		MetLife, Inc	Yes
1968	Guinness		6 times. 3rd version.		Yes
1971	L’Eggs	xx	Yes – The egg packaging was one of the most successful product launches of all time.	The brand no longer use the plastic egg as it is seen as wasteful.	Yes
1971	Eastman Kodak	xx			Yes
1971	Nike	xx	3+ times		Yes
1971	Quarter Oats	xx			Yes
1973	Atari	xx			Yes
1973	Merrill Lynch	xx			Yes
1974	United Way	xx			Yes
1974	Dunkin Donuts	xx			Yes
1975	I Love NY	xx			Yes
1976	Citicorp	xx			Yes
1976	United Way	xx			Yes
1977	Apple	xx	4+ times.		Yes
1979	Transamerica	xx			Yes
1981	Texaco	xx			Yes
1984	AT&T	xx			Yes
1995	Guinness		6 times. 4 th version.		Yes
1997	Guinness		6 times. 5 th version.		Yes
2005	Guinness		6 times. 6 th version.		Yes
2005	Mitsubishi		Changed 3 times. 3rd version.		Yes

http://www.hongkiat.com/blog/logo-evolution/

May 7, 2015June 9, 2016

MOTION: GIF Animation

Internet tech is often blamed for moving forward to fast. The changes happen too quickly for people to keep up. Sure, sometimes this may be true. However, there are some techs that flood around for years before taking a hold (Bluetooth). Or, there are other techs that are reinvented, or at least relaunched and begin another cycle of usage. The latter example is the certainly the story of the GIF animation.

GIF animation early days may have been jumping hamsters and spinning blinking buttons (my personal fav). Which is a far cry to presenting high-end fashion for some of the most pristine fashion houses. 2015 is the year that GIF animation returned to the tech world as a stylist fashionable option for delivering media rich content.

VIDEO: Back history on the GIF Animation format

January 31, 2015June 9, 2016

BLOG: The Power to Create

January 28, 2015October 21, 2017

Web Design Timeline

The Web Design Timeline – The Early Years

It was 1989, I was 15. Soul II Soul was riding the charts with Keep on Movin’. Sharing the message of not stopping the hands of time. While Tim Berners-Lee proposed the internet. Little did we know that

“Click Clock, find your own way to stay. The time will come one day”.

A few years later I was knee deep in design websites with code. I was the graphic designer in 1995 who understood what impact TABLES would be! I built sites that were balanced with spacer transparent GIF tiles. Those days were web design wonders.

Upon the arrival of CSS in 1996 – I grasped the potential. However, unlike any other website code, CSS is easy. Too easy.

In 1996, Website Design and Development was hard stuff. The learning curve was so short for CSS that it took programmers years to adapt to using CSS as the design element for controlling the website design.

You have got to recall that 1996 was also the “Flower Power” year of website design. Yes, we had Flash. I WAS A BIG FLASH FAN & MASTER FLASH DEVELOPER. My first Flash website (www.dagnabit.tv) won first prize from WIRED magazine. I loved working with Flash.

Web Design Timeline

1989 – Tim Berners-Lee Proposed the World Wide Web.
1991 – Text-based websites.
1993 – Mosaic Browser is launched.
1994 – The W3C is created.
1994 – Amazon arrive.
1995 – Design with Tables.
1995 – JavaScript brings the Pop-up Window.
1996 – Browser War: Microsoft and Netscape.
1996 – Internet Explorer – Uses CSS and tables.
1996 – Flash – in the pan. The limitless website design Flash Era.
1996 – Website Design with Dynamic HTML.
1997 – Macromedia release Dreamweaver website application.
1998 – Cascading Style Sheets (CSS) begin to impact website design.
2003 – WordPress arrives and provides user-driven content websites – takes a while to catch on.
2007 – Grids and Framework websites.
2010 – Responsive Website Design – why didn’t any website developer think of this solution years before?
2010 – Flat graphics are in fashion for website design. Yes, Apple did it first for the iPad. But rather than a new solution, Apple chose to step back to the early years of website design when graphics file size was a concern.

July 14, 2014June 16, 2016

ARTICLE: What does email tell?

IMMERSION is an online project that aims to address four precise areas of our email usage. By generating visual reports on your overall email usage. You are first stuck with self-reflection. Is it really possible that I composed (replied) to that many emails?

For most, it is now difficult to think what life was like prior to email. Two decades of internet usage we have witnessed an incredible increase of users. In December 1995, an estimated 16 million people logged onto the world wide web. In March 2014, 2,973 million people accessed the internet. In 20 years almost half (40.7%) of the world population now access the internet. An estimated 204 million emails are sent every minute. With 1440 minutes in the a day (204 milion x 1440) ... you can do the math!

Until recently accessing the web for many was to check email. Email was initially used to connect and correspond with family, friends, and businesses. Social Networking channels have transferred a large part of what was considered base email interaction - the simple chit chat.
The next aspect of Immersion, is the Art of connection. Visually the graphics relate how connected you are to one group compared to another. The graphic will also help visualize the connection between groups.

Privacy is perhaps the third reaction to the visualizations. As awesome as this visualization tool is, it is available to everyone. When Google hand over your email records to the FBI (or other agency). This is what they see. WIthout even opening any of your email, it is now easy to build an entire history of your usage in moments. Having access to one email account may not reveal a huge amount of information. However, having access to a vast number of emails, and cross referencing data reports - well, you can figure out that conclusion.

The next aspect of Immersion, is the Art of connection. Visually the graphics relate how connected you are to one group compared to another. The graphic will also help visualize the connection between groups.

The final aspect of using Immersion is for strategy. From my email data reports it is easy to see where most of your email time is spent. Which clients or family members have the most interactions (demands)? I can't say I was surprised to see which one of my clients emails me to most. What I found to be of most interest. The one client I find the hardest to understand via email, is also the person who emails me the most.

But visually seeing how much, or little we connect may have a profound impact on how you view and react to these relationships.

July 3, 2014July 21, 2016

REVIEW: Web Design That Works

Over the past 15+ years, the face of the graphical internet has changed. Often most of these online trends go unnoticed, or at least not talked about (considerably). Unless those changes happen on Facebook, then everyone has something to say.

The changes I am talking about are different than when Facebook make an update. Those changes come from one online business. Online trends come from more than one source. The trend may very well start from one source. When Apple updated the iPad to include more “simpler” icons than before – what followed was an online trend.

Everyone that works with a website has a sense of what is cool, and what is out. In internet years – Flash may be but a distant memory, Today, every business runs directly to WordPress for their online solution. With clean, functional, and user-friendly themes.

In 2014 – the modern website was light on design – has thoughtfully written content. Highlighted with photos or graphics. Forget the bells and whistles – we know they have never worked. Clean layout with precise content is king.

Here are the websites that have that curbside appeal (more sites to be added soon).

Studio O+A is a San Francisco-based interior design firm.

March 25, 2014June 16, 2016

EBOOK – Featured Sections

The device determines the best settings for the content.
The reader can select:

The Font.
The size of the font.
How wide to make the columns.
How many columns to use.
How many words to include on each line.
How much space to include in the leading (space between lines)
What the background color should be: white, black.
And what page margins to use.

A few other end-user considerations:

Image wrap rarely works well.
Images need descriptive captions as images often load onto the device screen alone and out of context.
Aligning images with content is different, as break pages can occur unexpectedly.
Kindle does not support Drop Caps.

February 25, 2014June 16, 2016

EBOOK – The Parts

While teaching a recent class on building an ebook it became very clear that few students understood the format. The simple truth is that most of the student were also not reading ebooks to have a working knowledge of the format. While the other remaining student who had experience, their knowledge was based on using one device.

The launch of ebooks have many parallels with the early years of web development and design. When web content was restricted by access limitations. Over the years, the web became somewhat standardized, with CSS3 and HTML5 adaptation. As of now the ebook realm does not have clear standard practices that can interpolated content from server to device without some degree of visual compromise. Yes, the line between content and visual integrity are getting closer - while the interactive elements drag behind. When building an ebook - you have got to visualize how the interactive components of the book will be.

When using Adobe InDesign to create your ebook, each of the following pages and features should be included within your InDesign document. Often creating a Master Pages will help maintain the visual integrity of the publication.

Color Front Book Cover - PNG format.
Color Back Book Cover - PNG format.
Book Blurb.
Title Page - and author credit.
Table of Contents.
Dedications.
The Book - With Chapter Titles and Sectional Consideration.
Include artwork and illustrations.
Index of book (optional).
Book Extras - Reader Resources (optional).
Author Bio and historical background.
Link to Author's Website and Newsletter.
Promotional Page - other publications, products, and services.
Copyright Information.

The Book Blurb

The book blurb is an essential component to a successful ebook. Without a blurb readers have no idea what your book is about. Your blurb should include enough information to connect with your reader and encourage them to download your publication. A poorly written blurb will result in poor downloads.

The Table of Contents

Ebook readers rely on the Table of Contents to navigate the book. Unlike a printed book that the reader is award about being in the middle of a book, compared to being at the end of a book, or within the first few pages. Knowing your placement in a book is determined by the feedback into your hands and eyes. It is easy for the reader of a printed page to see and feel what page they are (within reason). While the ebook reader has limited visual feedback and no feel feedback to determine their placement in a book. The void created by the reduced feedback from an ebook is at this time dealt with the Table of Contents. Permitting the reader to quickly move between chapters without have to flip one electronic page at a time.

April 26, 2012June 9, 2016

GRAPHIC: Marketing Series

How to make image text searchable

Example of how to layer searchable text over your website graphic. A great method to keep your graphics up-to-date. While improving your SEO ranking.

Sample of series of marketing graphics created to promote computer classes.

What made this project interesting was how I coded the graphics into the website.

We know that Search Engines do not read text in graphics. Having searchable text is one of the most important elements for any website. I created a practical custom CSS solution. That is visually pleasing to the website visitor, while capturing interest of the search engines.

NOTICE: you can not select the text from the top part of the graphics, but you can select the red notice text. My method makes the graphic content completely optimized for the search engines. Continue reading “GRAPHIC: Marketing Series”

June 25, 2004November 24, 2018

BLOG: How to create a logo

When creating a logo – the process can be very different from one client to the next. Often the clients expectations and lack of experience can account for the varied design processes.

Designing a Logo for a Brand

Given my client pool, I am lucky to work with creative people. I surround myself with skillful and creative types that are seldom wrong when it comes to the principles of visual composition.

When clients come to me for graphic design services – they often have the design concept and brand philosophy developed. At which time – my role as the graphic designer is defined. I am there to ensure that the logo renders correctly and is aesthetically pleasing – while reaching the project design objective.

Designing the logo for a Brand. That’s the natural Logo Design approach. The conceptual developmental of the Brand is complete. The visual logo simply needs to acquire the right personality.

And the Rough Sketches can quickly move into refined ideas.

Designing a Logo without a Brand

Yes, I know – as a graphic designer we should never let this happen. But it does. Maybe you like the business idea or the client is refreshing, or you just feel like giving someone a break. Whatever the reason – you allow the client to move forward to the design process, without a brand. With the idea of working backward to establish the brand philosophy.

The difference between the old client and the newbie is that the experienced have structured their thoughts into a formatted project plan. The other client this has the ideas in their head. It isn’t that they don’t know – they just have never been asked before. And so the process begins.

From Logo to Brand

For most of the world, the role of Branding and Logo Design is confusing. The experienced graphic designer understands that the Brand is the business reputation – the business equity – built upon reliable products and reliable service.

The Logo Design – while the logo is the first visual component of the branding process. The logo does not stand alone to create or maintain the business values and customer loyalty.

For more information on how to build a strong, loyal brand – read my blog BUILDING A BRAND.

Creating a logo without a brand is not an ideal approach. But, as many graphic designers understand – especially those graphic designers that work with start-ups. You as the designer may be the first person in the world to ask your clients about their business goals.

Your Graphic Designer is the only person who cares to ask you branding questions

Be honest, no-one else is interested in our work ideas. People are not stopping me in the street and asked about my yearly business goals, or what I hope to achieve ten years from now. No one cares about my moral stands. I do however get stopped in the grocery store to answer computer tech and design questions. Which is typically fine, expect when selecting toilet rolls – that I like to do alone.

Building the Brand backward

The logo creating begins. In this case, the client was more visual that conceptual.

Early Logo Roughs

Get the design ball rolling with simple sketches.

Website Design for SmartPhone Users

What are the SEO reporting?

How the same site content loads on different devices?

Asheville Website Design Example on iPad Users

Asheville Website Design Example on iPhone 6

How does the Website Load on Different Devices?

Asheville Website Design Example on iPhone 3

How long does it take to build an International brand?

VIDEO: Back history on the GIF Animation format

Asheville Creativity Blog Resource

Motion Graphic on the Power to be Creative

Motion Graphic on the Power to be Creative

The Web Design Timeline – The Early Years

Web Design Timeline

Email Messages

Modern Website Design

Why do online trends have an impact?

Understanding E-Book Limitations

What you can expect from one device to the other:

The parts of an ebook.

The parts of an Ebook that need to built.

The Book Blurb

The Table of Contents

How to make image text searchable

Designing a Logo for a Brand

Designing a Logo without a Brand

From Logo to Brand

Your Graphic Designer is the only person who cares to ask you branding questions

Building the Brand backward

Early Logo Roughs