duMobility's Blog

about.me/durul
Recent Tweets @duruldalkanat

In OS X Yosemite, run these commands in Terminal:

defaults delete com.apple.dock

then

killall Dock

That should fix it.

Facebook open sourced a set of tools that you can use from the LLDB console in Xcode. My favorite commands are pvc, pviews, visualize, fv, and fvc. You can get it here: https://github.com/facebook/chisel

p4merge.

/ vi / etc will make you go blind. Use this instead: https://gist.github.com/tony4d/3… Xcode has some tools built in that let you do this, but sometimes I prefer p4merge for quickness.

1. The main thread is for the user
2. UI can only be manipulated on main thread
3. Networking must be asynchronous
4. Do not directly create threads
5. Do not block the user

Android cheatsheet for graphic designers

Graphic designers aren’t programmers and sometimes don’t know how to properly prepare graphic assets for developers. This simple cheatsheet should help them to do their job better, and to simplify developers’ lives.

Content

  1. Dimensions
    1. Screen densities and icon dimensions
    2. Google Play asset dimensions
    3. Dimension units
    4. Size buckets
    5. Views dimensions and spacing
    6. Action bar height
    7. Text size
  2. Images and themes
    1. Nine-patch
    2. Colors
    3. Holo themes
  3. Naming conventions
    1. Naming conventions for drawables
    2. Naming conventions for icon assets
    3. Naming conventions for selector states
    4. Organizing drawables to directories
  4. Resources
    1. Graphic generators
    2. Useful links for designers
    3. Download
  5. Written by

Dimensions

Screen densities and icon dimensions

Qualifier DPI Scaling factor Launcher icon Action bar, tab icon Notification icon (API 11) Notification icon (API 9) Notification icon (older)
ldpi 120 0.75 36 x 36
32 x 32
24 x 24
18 x 18
18 x 18
16 x 16
12 x 19
12 x 12
19 x 19
16 x 16
mdpi 160 1.0 48 x 48
42 x 42
32 x 32
24 x 24
24 x 24
22 x 22
16 x 25
16 x 16
25 x 25
21 x 21
hdpi 240 1.5 72 x 72
64 x 64
48 x 48
36 x 36
36 x 36
33 x 33
24 x 38
24 x 24
38 x 38
32 x 32
xhdpi 320 2.0 96 x 96
84 x 84
64 x 64
48 x 48
48 x 48
44 x 44
32 x 50
32 x 32
50 x 50
42 x 42
xxhdpi 480 3.0 144 x 144
126 x 126
96 x 96
72 x 72
72 x 72
66 x 66
48 x 75
48 x 48
75 x 75
63 x 63

Notice: the first icon dimension in table cell is full asset size, the second icon dimension is optical square. Dimension values are in pixels.

Tip: creating ldpi assets is not really needed anymore. The devices are rare and the platform will just scale down mdpi.

Sources and useful links: Iconography, Supporting Multiple Screens, Icon Design Guidelines, Dimension

Google Play asset dimensions

Asset Type Required Image type Dimension
Screenshot yes JPEG or 24-bit PNG
(no alpha)
min length for any side: 320 px
max length for any side: 3840 px
High-res app icon yes 32-bit PNG
(with alpha)
512 x 512 px
Feature graphic no JPEG or 24-bit PNG
(no alpha)
1024 x 500 px
Promotional graphic no JPEG or 24-bit PNG
(no alpha)
180 x 120 px
Video link no URL of YouTube video -

Sources and useful links: Graphic and Image Assets, Google Play Featured-Image Guidelines, Iconography

Dimension units

Unit Units / physical inch Density independent Same physical size on every screen
px varies no no
in 1 yes yes
mm 25.4 yes yes
pt 72 yes yes
dp ~160 yes no
sp ~160 yes no

Sources and useful links: Understanding Density Independence in Android

Size buckets

Type Dimension
Handset smaller than 600 dp
Tablet larger than or equal 600 dp

Size buckets

Notice: one dp (density-independent pixel) is one pixel on a 160 DPI screen.

Sources and useful links: Metrics and Grids

Views dimensions and spacing

Touchable UI components are generally laid out along 48 dp units. Spacing between each UI element is 8 dp.

48dp rhythm

Button dimensions and spacing

Form dimensions and spacing

Sources and useful links: Metrics and Grids

Action bar height

Qualifier Dimension
Portrait 48 dp
Landscape 40 dp
Tablet 56 dp

Sources and useful links: Action Bar

Text size

Type Dimension
Micro 12 sp
Small 14 sp
Medium 18 sp
Large 22 sp

Notice: one sp (scale-independent pixel) is one pixel on a 160 DPI screen if the user’s global text scale is set to 100%.

Sources and useful links: Typography

Images and themes

Nine-patch

A Nine-patch drawable is a stretchable bitmap image, which Android will automatically resize to accommodate the contents of the view in which you have placed it as the background, e.g. nine-patch background for button, which must stretch to accommodate strings of various lengths. The rules for nine-patch image are following:

  • Standard PNG image with alpha
  • Filename suffix is ".9.png", e.g. “btn_login_normal.9.png”
  • Image has an extra 1 pixel wide border, used to define the stretchable/static/padding areas
  • Stretchable sections are indicated by 1 px wide black line(s) in the left and top part of the border
  • Static sections are indicated by fully transparent or white pixels
  • Padding area (optional) is indicated by 1 px wide black line in the right and bottom part of the border

Nine-patch

Sources and useful links: Canvas and Drawables, Draw 9-patch, Simple nine patch generator

Colors

Use color primarily for emphasis. Blue is the standard accent color in Android’s color palette. Note that red and green may be indistinguishable to color-blind users. Primary colors are as follows:

  • #33B5E5
  • #AA66CC
  • #99CC00
  • #FFBB33
  • #FF4444
  • #0099CC
  • #9933CC
  • #669900
  • #FF8800
  • #CC0000

Sources and useful links: Color

Holo themes

Android provides three system themes:

  • Holo Light
  • Holo Dark
  • Holo Light with dark action bar

Sources and useful links: Themes, Holo Everywhere

Naming conventions

Naming conventions for drawables

File names must contain only lowercase a-z, 0-9, or _.

Drawables for the specific views (ListView, TextView, EditText, ProgressBar, CheckBox etc.) should be named like this views keeping the naming rules, e.g. drawable for CheckBox should be named “checkbox_on_bg.png”.

Asset Type Prefix Example
Action bar ab_ ab_stacked.9.png
Button btn_ btn_send_pressed.9.png
Dialog dialog_ dialog_top.9.png
Divider divider_ divider_horizontal.9.png
Icon ic_ ic_star.png
Menu menu_ menu_submenu_bg.9.png
Notification notification_ notification_bg.9.png
Tabs tab_ tab_pressed.9.png

Sources and useful links: naming conventions taken from the Android SDK

Naming conventions for icon assets

Asset Type Prefix Example
Icons ic_ ic_star.png
Launcher icons ic_launcher ic_launcher_calendar.png
Action bar icons ic_menu ic_menu_archive.png
Status bar icons ic_stat_notify ic_stat_notify_msg.png
Tab icons ic_tab ic_tab_recent.png
Dialog icons ic_dialog ic_dialog_info.png

Sources and useful links: Icon Design Guidelines

Naming conventions for selector states

State Suffix Example
Normal _normal btn_order_normal.9.png
Pressed _pressed btn_order_pressed.9.png
Focused _focused btn_order_focused.9.png
Disabled _disabled btn_order_disabled.9.png
Selected _selected btn_order_selected.9.png

Sources and useful links: Touch Feedback

Organizing drawables to directories

One drawable must have the same file name for all screen densities (ldpi, mdpi, hdpi etc.) and all these files must be organized according to density into the following directories. Here’s the resources directory structure for drawables:

  • res
    • drawable-ldpi
    • drawable-mdpi
    • drawable-hdpi
    • drawable-xhdpi
    • drawable-xxhdpi

Resources

Graphic generators

Download

Android Icon Templates Pack v4.0
Source: Android Developers

Android Design 08/2012
Source: Android Developers

Android UI Design Kit PSD 4.2
Source: Taylor Ling on Android UI & UX

Android Developer Icons – Photoshop Shapes
Source: Spiderfly Apps

cocoaheads:

Wish we could say more.

Command 1~8 to jump through the Navigators, Command 0 to close the navigation area.

Command Alt 1~6 to jump through the Inspectors, Command Alt 0 to close the utility area.

Control Command Alt 1~4 to jump through the Libraries.

Control 1~6 to bring down tabs in the Jump Bar.

Never trust any input!
Validate input from all untrusted sources - use whitelists not blacklists
Plan for security from the start - it’s not something you can bolt on at the end
Keep it simple - complexity increases the likelihood of security holes
Keep your attack surface to a minimum
Make sure you fail securely
Use defence in depth
Adhere to the principle of least privilege
Use threat modelling
Compartmentalize - so your system is not all or nothing
Hiding secrets is hard - and secrets hidden in code won’t stay secret for long
Don’t write your own crypto
Using crypto doesn’t mean you’re secure (attackers will look for a weaker link)
Be aware of buffer overflows and how to protect against them

//
// Original Playground taken from https://gist.github.com/u10int/a178945a451d48d4c961
//
// Extended to include > Bool {
let range: NSRange = NSMakeRange(0, countElements(left))
if right.regex {
let matches: AnyObject[] = right.regex!.matchesInString(left, options: right.matchingOptions, range: range)
return matches.count > 0
}

return false
}

func =~(left: String, right: String) -> Bool {
return left =~ Regex(pattern: right)
}

operator infix > String{
if left =~ right.regex {
let range: NSRange = NSMakeRange(0, countElements(left))
if right.regex.regex {
return right.regex.regex!.stringByReplacingMatchesInString(left, options: right.regex.matchingOptions, range: range, withTemplate: right.template)
}
}
return left
}

func > String{
return left >

Swift supports method overloading.

class Test
{
func test(a : String) -> NSString {
return a;
}
func test(a : UInt) -> NSString {
return “{\(a)}”
}
}

Test().test(“Foo”) // “Foo”
Test().test(123) // “{123}”

println(Test().test(“Foo”))
println(Test().test(123))

pavanladkani:

Brilliant graphic design…

(via fabforgottennobility)

keepcalmandprogram:


This animated gif is wowzy.

keepcalmandprogram:

This animated gif is wowzy.

(via italkapple)

When designing responsive websites it pays to know the various resolutions so you can create proper breakpoints in your design.

Apple

Apple Ipad 2 – 1024 x 768 at at 132 ppi with a 9.7 inch display
Apple Ipad with Retina display – 2048-x 1536 at 264 ppi with 9.7 inch display
Apple Mini – 1024 x 768 at 153 ppi with a 7.9 inch display
Apple IPod – 1136 x 640 at 326 ppi
Apple IPod -4th generation – 960 x 640 at 320ppi
Apple Ipod Touch – 1136 x 640 at 326 ppi
Apple IPhone 4 and 4S – 960 x 640 at 326 ppi with a 3.5″ display
Apple IPhone 5 – 1136 x 640 at 326 ppi with a 4″ display

Amazon Kindle

Kindle Fire (1st gen) 1024 x 600 with 7″ display
Kindle Fire (2nd gen) 1024 x 600 with 7″ display
Kindle Fire HD 7″ – 1280 x 800 with 7″ display
Kindle Fire 8.9 – 1920 x 1200 with 8.9″ display

Android Phones

Samsung Galaxy II – 800 x 480 at 218 ppi
Samsung Galaxy III – 1280 x 720 at 306 ppi
Blackberry 10 – 1280 x 768
Blackberry Z10 – 1280 x 768

Android Tablets

Samsung Galaxy Tab 10 – 1280 x 800 – 10″ display
Samsung Galaxy Tab 7 and 7 Plus – 1024 x 600 – 7″ display
Acer Iconia Tab A500 – 1280 x 800 – 10″ display

The most commonly used response codes are:

Code 200: The request has succeeded.
Code 301: The resource has moved permanently.
Code 400: Bad request.
Code 401: Unauthorized.
Code 403: Forbidden.
Code 404: Not found.
Code 408: Request timed out.
Code 5xx: All codes starting with 5 indicate a server error.”

MacBook’unuzu kapatın
Güç adaptörünü pirize ve MacBook’unuza bağlayın
Klavyede sol tarafta bulunan Shift - Control - Alt (Option) ve kapama açma tuşuna aynı anda basın
Tüm tuşları aynı anda bırakın
MacBook’unuzu açma kapa tuşuna basarak tekrar açın