Logo Design

Logo Design Tips
http://www.creativebloq.com/graphic-design/pro-guide-logo-design-21221
Preparation:
01. Research your audience
02. Immerse yourself in the brand
03. Do your online research
Logo Moose http://logomoose.com/
Logo Gala http://www.logogala.com/
04 Seek inspiration
05 Fight the temptation to imitate
06 Don't let the client dictate
07 Create a board and rip it up

Initial Design Work
08 Sketch it out
09 Create vectors

Nailing the Typography
10 Choose your typeface carefully
11 Adapt an existing typeface
12 Avoid gimmicky fonts
13 Consider a type-only approach

Use of Space
14 Think about the space around your logo design
15 Use negative space carefully

Graphic Design
16 Make your design active, not passive
17 Consider tones as well as colours
18 Be experimental

Keep it Clean and Modern
19 Don't use more than two fonts
20 Ensure it works on dark backgrounds
21 Keep abreast of trends
22 Subtract as much as possible
23 Don't try to do too much
24 Create a lock up version
25 Make your logo design responsible

Functionality
26 Create different size versions
27 Make it legible
28 Create a non-print variants
29 Make it future-proof

Business Consideration
30 Don't confuse logo with brand
31 Get the tone right

Feedback
32 Show your logo design around
33 Stick to your convictions
34 Ask the client specific questions
35 Test it internationally
36 Check for hidden words
37 Expect your logo design to be panned

Style Guides
38 Create a logo style guide
39 Dictate color options
40 Specific sizes
41 Advice on positioning
42 Advice on spacing
43 Define no-nos

Going future
44 Download the logo design flowchart
http://mos.computerarts.co.uk/pdf/CAP148_chart.pdf

Case Study: Design Conspirato Website

The artistic director of Conspriato Chamber Singers, Liska, contacted me in August 2011 and expressed the interest of update their website http://www.conspirato.ca/

Analysis Phase

- Meeting with stakeholders (meeting, conference calls)
I met with Liska in September to discuss the objective and the content she wishes for the new site.
She wants the website to have a fresh new look.

- Develop usability goals and objectives
The choir's main objective is to perform concert for audience.
The website should serve the audience and the choir artist:
For the audience (public):
They needs to know the upcoming event, ticket information, concert program (what each pieces in the concert), background of the choir, the artist
For the artist (private):
They needs to know how to audition, when to rehearse, what music pieces to sing

- Conduct field studies (visit work environment, watch how users work)

- Look at competitive product
Soweto Gospel Choir
http://www.sowetogospelchoir.com/

Home: Welcome, Our Story, Choir News
Performance: current, past, future
The Choir: Gallery, History, Charities, Choir Members
Press: Blog, Reviews, Images, Press Release,  Awards
Discography: CDs & DVDs,  CD Reviews
Video:
Songs: Audio Samples, Lyrics, Collaborations
Presenters:
Links:
Contacts:

Monteverdi Choir
http://www.monteverdi.co.uk/

Home:
Concerts:
About us:
News: News, Concert Reviews, CD Reviews
Education: Apprenticeship Program, School Project
Media:
Support us:
Shop:
Contact us: Vacancies

The Cardinal's Musick
http://www.cardinallsmusick.com/

Home:
Recordings: our music
Performance: upcoming events
Latest News: what's happening
About us: the group
Promoters: how to hire us
Workshops: education
Friends: join us
Reviews: what people say

Toronto Chamber Choir
http://www.torontochamberchoir.ca/index.php

- Create user profiles (Persona)
Fan of the choir:  being to the concert, fall in love with the choir
Potential employer: looking for a talented artist
Artist: member of the choir

- Develop a task analysis (Mental Model)

Fan of the choir:  upcoming concerts, buying tickets, music pieces
Employer who is looking for the artist: choir information, artist, sample music
Artist: join the choir, upcoming events, rehearsal, music pieces

- Document scenario

Design Phase

- Brainstorm concepts and ideas
Chamber Choir : A chamber choir or group of chamber singers is the choral equivalent of a chamber ensemble, using voices instead of instruments.

Conspirato: con spirito means with sprite, with feeling

- Develop screen flow

- Walkthrough the screen flow with the team

- Create low-fidelity wireframe (Balsamiq)

- Walkthrough the low-fidelity wireframe with the team / user

- Create high-fidelity wireframe (Photoshop)

- Walkthrough the high-fidelity wireframe with the team / user

- Document design specification

Implementation Phase

- Conduct usability testing as soon as possible

Deployment Phase

- Gather user feedbacks (Surveys, Field studies)

- Check usability objectives

Research: Design For Android

Design Principle
http://developer.android.com/design/get-started/principles.html

Real objects are more fun than buttons and menus

Allow people to directly touch and manipulate objects in your app. It reduces the cognitive effort needed to perform a task while making it more emotionally satisfying.

Get to know me

Learn peoples' preferences over time. Rather than asking them to make the same choices over and over, place previous choices within easy reach.

Keep it brief

Use short phrases with simple words. 

Pictures are faster than words

Consider using pictures to explain ideas.

Never lose my stuff

Save what people took time to create and let them access it from anywhere. Remember settings, personal touches, and creations across phones, tablets, and computers. It makes upgrading the easiest thing in the world.

Sprinkle encouragement

Break complex tasks into smaller steps that can be easily accomplished. Give feedback on actions, even if it's just a subtle glow.

Supporting Multiple Screens
http://developer.android.com/guide/practices/screens_support.html

Themes
Holo Light
Holo Dark
Holo Light with dark action bar

Touch Feedback
http://developer.android.com/design/style/touch-feedback.html

Density
http://developer.android.com/about/dashboards/index.html
ldpi (low), mdpi (medium), hdpi (high), and xhdpi (extra high)

Touchable UI components are generally laid out along 48dp units (=9mm)
This is comfortably in the range of recommended target sizes (7-10 mm) for touchscreen objects and users will be able to reliably and accurately target them with their fingers.

Spacing between each UI element is 8dp.

Design for Android
http://mobile.smashingmagazine.com/2012/07/26/android-design-tips/

http://coding.smashingmagazine.com/2011/06/30/designing-for-android/


Glossary
DPI (Dots Per Inch): Screen Density
DP (Density-independent Pixels)

WebGL

WebGL Experiments
http://www.chromeexperiments.com/webgl

Learning WebGL
http://learningwebgl.com/blog/?page_id=1217

WebGL Specification
http://www.khronos.org/registry/webgl/specs/latest/

Problems & Solutions:

Problem 1: ‘Can not Initialise’ in Firefox 4+
1. Type “about:config” in your browser’s URL bar
2. Filter by ‘webgl’
3. Set webgl.force-enabled = true (double-click)
4. Set webgl.verbose = true (to see error Tools > Error Console)
5. Restart Firefox
http://support.mozilla.com/en-US/questions/720087

Problem 2: Cross-domain WebGL Texture doesn't render
- ‘forbidden to load a WebGL texture from a cross-domain element’ in Firefox 4+
- or 'Uncaught Error: SECURITY_ERR: DOM Exception 18' in Chrome 10+
Solution1:  work locally
1. Encode the image into base64
Binary File to Base64 Encoder
http://www.greywyvern.com/code/php/binary2base64
 2. Put data source in place of the image's path
<img src="data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAADIA...really long string" alt="" />
http://www.devirtuoso.com/2011/09/working-with-images-and-html5-canvas-locally/
Solution2:
http://mmmovania.blogspot.com/2011/09/resolving-webgl-cross-domain-image.html

HTML 5, CSS3 and JavaScript

1. 8 Simply Amazing HTML5 Canvas and Javascript Animations
http://www.queness.com/post/3885/8-simply-amazing-html5-canvas-and-javascript-animations

e.g. Bomomo

2. 10 Jaw Dropping HTML5 and Javascript Effects
http://www.queness.com/post/4650/10-jaw-dropping-html5-and-javascript-effects

e.g. Blob

3. 13 Amazing Examples of HTML5 and CSS3
http://www.queness.com/post/4105/13-amazing-examples-of-html5-and-css3

e.g Coke Can

4. WebGL
http://www.chromeexperiments.com/webgl

how to prevent SQL injection

SQL Injection Attacks and Some Tips
http://www.codeproject.com/KB/database/SqlInjectionAttacks.aspx

' UNION SELECT name, type, id FROM sysobjects;--
- the initial apostrophe closes the opening quote in the original SQL statement.
- the two dashes at the end starts a comment, which means that anything left in the original SQL statement is ignored.

SQL Injection
http://en.wikipedia.org/wiki/SQL_injection

' or '1'='1
' or '1'='1' -- '
' or '1'='1' ({ '
' or '1'='1' /* '


If this code were to be used in an authentication procedure then this example could be used to force the selection of a valid username because the evaluation of '1'='1' is always true.

http://www.wwwcoder.com/main/parentid/258/site/2966/68/default.aspx

PHP mail()

No email was sent

1. check if sendmail server is running

[root]# service sendmail status

Configuring Linux Mail Servers

http://www.linuxhomenetworking.com/wiki/index.php/Quick_HOWTO_:_Ch21_:_Configuring_Linux_Mail_Servers#Starting_Sendmail