Руководство по разработке в IOS: Интерфейс — Часть 1

Apple на протяжении многих лет является ведущей компанией в мобильном мире с его iPhone и IPad. Они держат большую часть рынка мобильных платформ, и это является причиной того, что большинство клиентов хотят, чтобы их приложения были представлены в App Store от Apple, а это побуждает разработчиков учиться создавать iPhone-приложения.

Разработка приложений для iPhone — это не так сложно, как вы думаете, и этот пост послужит вам полным руководством по всему процессу создания приложения для iPhone. Мы будем обсуждать причины, этапы, и инструменты для разработки приложений, и в конечном итоге вы получите легкий учебник для разработки базового приложения iPhone использованием Xcode 4.2.
Если вы хотите заработать денег, или у вас просто появилась интересная идея для приложения, которое может сделать вас миллионером, давайте начнем создание вашего первого приложения для iPhone.
Примечание: Вам понадобится компьютер с операционной системой Macintosh (Mac OS) для установки Xcode и разработки приложений, на Windows легально этого сделать нельзя.

Зачем разрабатывать для Apple?

Этот вопрос часто задают, поэтому стоит объяснить, почему вы должны быть заинтересованы в iPhone-разработках. Как было сказано в предисловии, iPhone в настоящее время занимает бOльшую часть рынка акций мобильных платформ. Этой причины должно быть достаточно для того, чтобы научиться разрабатывать приложения для iPhone, независимо от того, разрабатываете ли вы для себя или клиентов, ведь большинство людей надеются, что их приложения могут быть доступны во всём мире.

Apple любит простоту, и это относится и к их продукции, и к платформе. iOS представляет собой операционную систему, которая устанавливается на все мобильные устройства Apple. К ним относятся iPod Touch, iPhone и iPad. Так что имейте в виду, когда вы разрабатываете приложения для iPhone, вы могли бы создавать приложения для всех других устройств с IOS!
Кроме того, замечательно, какое количество усилий, прилагаемых для написания кода, может быть сохранено. При написании кода для iPhone-приложений, вы используете тот же язык программирования, что и всех остальных устройств от Apple. Это означает, что, когда вы разрабатываете приложение iPhone, приложение в дальнейшем может быть интегрировано в iPad и даже Mac.
Objective-C является основным языком программирования, включенным во все платформы. Наряду с Objective-C, вы также будете создавать iPhone приложение с помощью среды программирования Cocoa Touch.
Это всего лишь небольшое количество информации, чтобы вы смогли начать разработку приложений для iPhone. Разработка является весьма сложным процессом, но не спешите расстраиваться. Решение остается за вами.

Планирование структуры приложения

При стандартной идеологии создания iPhone-приложений вам придется пройти через несколько этапов. Первый этап включает в себя планирование и эскизы. Прежде всего, вам нужно иметь представление о том, что ваше приложение будет делать. Почему люди захотят его скачать? И какие функции вы хотите включить? Это самый важный этап, ведь если вы все сделаете правильно, вы сэкономите много времени и избежите неприятностей в стадии кодирования.

Рекомендуется набрасывать идеи для нескольких страниц (или экранов) вашего приложения. Просто нарисуйте прямоугольник, а может быть, 5 или 6, на листе бумаги, нарисуйте то, что вы хотите увидеть на каждой странице вашего приложения. Вы можете представлять экраны как разные страницы сайта. Каждый экран будет предлагать различные функции, такие как форма регистрации, список контактов или таблицу данных.

Ниже — краткий перечень различных элементов пользовательского меню:

  • Строка состояния (Status Bar) — отображает текущий уровень зарядки, 3G-связь, прием и многое другое. Рекомендуется всегда включать эти элементы.
  • Панель навигации (Navigation Bar) — Дает пользователям возможность перемещаться между страницами. Часто сюда включают кнопки на левой стороне меню, чтобы пользователь мог вернуться к предыдущей странице.
  • Панель инструментов (Toolbar) — появляется в нижней части iPhone приложений. Здесь будет несколько иконок, связанных с некоторыми функциями, такими как поделиться, загрузить, удалить и т.д.
  • Меню вкладок (Tab Bar) — Очень похоже на панель инструментов, только теперь вы работаете с вкладками. Когда пользователь щелкает по иконке вкладок, она будет автоматически выделена, и она будет подсвечиваться. Эта меню используется для переключения между окнами.

Этот список содержит только панели инструментов, которые вы можете найти в большинстве приложений. Есть и другие стили, которые вы можете найти в руководстве iOS UI Element Usage Guidelines. Настоятельно рекомендуется обратиться к этому руководству, если у вас есть какие-либо сомнения по интерфейсу iPhone.
В этой статье я не буду описывать каждый элемент пользовательского интерфейса. Слишком много элементов для рассмотрения, и вы не будете использовать все из них в одном приложении. Но вы можете черпать вдохновение из принципов, предложенных выше, и из других приложений iPhone, которые вам понравились.

Дизайн макета в Photoshop

Уверен, что большинство из вас достаточно хорошо разбирается в Adobe Photoshop. Это ведущее программное обеспечение для создания графики для сайта, баннеров, логотипов, и мобильных макетов. Разработка графики для сайта — довольно простой процесс, но все становится немного более сложным, когда речь заходит о дизайне iPhone приложений. Если вы хотите создать приложение, вы должны создать идеальный пиксельный дизайн макета с самого начала.

Для начала мы должны обсудить настройки в Photoshop. Так как мы разрабатываем для iPhone, нам необходимо рассмотреть два различных стиля дизайна. Стандартный дисплей iPhone составляет 320 х 480 пикселей. Однако iPhone 4 имеет новый дисплей «retina», который удваивает количество пикселей в пределах одного экрана. Таким образом, вы должны удвоить разрешение до 640 х 960 пикселей и создавать дизайн макетов и для этого стандарта.

Это означает, что вам также необходимо создать 2 набора иконок для ваших макетов. Первоначально иконки будут в 163 ppi, но вам нужно включить иконки с 326 ppi для iPhone 4. Иконки традиционно отмечаются @2x в конце названия их файлов, например «icon@2x.png» ( Немного больше об этом в статье iPhone 4 Retina Display: Techniques and Workflow ).
Теперь давайте оптимизировать наши новые настройки. Сначала мы должны отредактировать некоторые настройки, так что зайдите в Photoshop> Edit> Preferences> Guides, Grid and Slices. Мы установим линии сетки Gridline через каждые 20 пикселей с subdivisions на 2. При проектировании для дисплея iPhone 4, линии 2px будут означать 1 pts на экране. Вы должны это иметь в виду при масштабирования вашего приложения.

Как правило, легче создавать мои проекты с более высоким разрешением, а затем масштабировать их, но вы можете попробовать оба способа и посмотреть, что именно вам подходит лучше всего. Используйте настройки 640 х 960 пикселей при 326 ppi — лучше cохраните эти настройки, если вы предполагаете часто их использовать.

Использование шаблонных элементов

Теперь можно использовать Photoshop для создания идеального пиксельного макета, но это очень утомительная работа. Я рекомендую вам iPhone 4 GUI PSD от Teehan+Lax (см. Элементы интерфейса Mac, iPhone и iPad PSD).

Это огромный файл, в нем очень много элементов.

Совет: чтобы облегчить задачу, можно нажать V и активировать инструмент Move Tool, а затем выбрать в верхней панели Auto-Select, и выбрать Layer. С этими настройками вы можете нажать на любой элемент и Photoshop приведет вас к соответствующему слою.

Не бойтесь экспериментировать с макетом, вы даже можете создать прототип приложения с помощью макета. В зависимости от вашего приложения, вы можете включить множество функций, многие из которых вы сможете найти в этом файле PSD. Кроме того, можно перейти к слою этих элементов и отредактировать шрифт, градиент цвета, и другие стили дизайна. Главное — не изменяйте размер, так как все панели и элементы пользовательского интерфейса по умолчанию установлены стандартных размеров.

Разработка приложений в Xcode

Инструмент разработки для IOS и Mac OS X программирования называется Xcode. Если вы работаете в OS X Lion, вы можете найти Xcode и все соответствующие пакеты бесплатно в Mac App Store.

После завершения установки, запустите Xcode, и появится экран приветствия. Отсюда вы можете загрузить старый проект или создать новый. Сейчас вы должны нажать кнопку «Create a new Xcode project», и в новом окне вам будет предложено несколько вариантов. Выберите «Single View Application» и нажмите «Next». Вы можете назвать новое приложение, например, Test (желательно без пробелов), затем в поле «Company Identifier» введите любое слово, например, MyCompany, выберите папку и нажмите кнопку «Save».
Xcode создаст директорию и откроет новое окно для работы. Вы увидите список файлов, а папка, которая названа в честь вашего приложения, будет первой.

С новым Xcode 4,2 у нас есть два варианта дизайна элементов внешнего интерфейса. Классический xib/nib формат является стандартным для Mac OS X и приложений IOS, он требует от вас создавать каждый раз новый вид страницы.
Кроме того, вы увидите и файлы .h и .m. Это сокращенные имена файлов для заголовков и выполнения. Эти файлы находятся там, где вы пишете все Objective-C функции и переменные, необходимые для запуска вашего приложения.
Теперь нужно объяснить, как Xcode работает с MVC (Model, View, Controller), что является причиной того, что нам нужно 2 файла для каждого контроллера.

Программная иерархия MVC

Чтобы понять, как приложение работает, вам необходимо понять архитектуру его программирования. С Model, View, Controller (MVC) в качестве основы, Xcode может разделить все ваши дисплеи и коды интерфейса, исходя из вашей логики и функций обработки. На первый взгляд MVC может показаться запутанным, но это дело привычки.

Чтобы было легче понять, разберём каждый объект:

  • Модель (Model) — Вмещает все ваши логические и основные данные. Это: переменные, подключения к внешним RSS-каналам или изображения, подробные функции и числовую информацию. Этот слой полностью отделяется от вашего визуального оформления, так что вы можете легко изменить вид дисплея, и у вас все равно останутся те же данные.
  • Вид (View) — экран или стиль отображения вашего приложения. Список таблиц, профиль страницы, статьи, аудио-плеер, видео плеер — все эти примеры экранов. Вы можете изменить свой стиль и удалять элементы, но вы будете работать с теми же данными в вашей модели.
  • Контроллер (Controller) — выступает в качестве посредника между ними. Вы подключаете объекты вида в ViewController, который передает информацию модели. Так что пользователь может нажать на кнопку, и зарегистрироваться в вашей модели. Затем выполнить выход из системы, и через тот же контроллер передать сообщение «вы успешно вышли из системы!»

В основном ваша модель содержит всю информацию и функции, которые вам понадобятся для отображения на экране. Но модели не могут взаимодействовать с экраном, зато могут виды. Виды – это, в основном, все визуальные эффекты, и они могут только извлекать данные через ViewController. Контроллер на самом деле — это сложный способ передачи данных через интерфейс. Таким образом, вы можете обновлять дизайн, при этом не теряя какой-либо функциональности.
Обладая этими знаниями, вы не должны столкнуться с трудностями при попытке создать новое приложение. Как упоминалось ранее, Objective-C является основным языком программирования, который вы будете использовать для разработки приложений. Он построен на языке C, с обновленным синтаксисом и несколькими дополнительными парадигмами. Понадобится много времени, чтобы познакомиться с языком.

Дизайн вида с помощью iOS 5 Storyboards

Теперь, когда мы рассмотрели технические аспекты приложения, мы должны немного времени потратить на проектирование интерфейса. Я предполагаю, что вы выбрали «Storyboard» при создании проекта, что означает, что вы можете найти файл MainStoryboard_iPhone.storyboard в папке, расположенной на левой стороне окна. Нажмите на файл, чтобы выбрать его и открыть.

Новая боковая панель должна появиться непосредственно справа от папки. Это называется Document Outline, и это своего рода быстрый способ предварительного просмотра для проверки всех доступных видов в Storyboard.

Мы хотим начать с добавления нескольких элементов страницы. Нам нужны два разных элемента: панель навигации Navigation Bar и панели вкладок Tab Bar. Перед тем, как создать их, зайдите в Attributes Inspector (View > Utilities > Show Attributes Inspector) в правой стороне окна, а затем посмотрите на Status Bar. По умолчанию он установлен в положение Inferred, который использует стандартный для iPhone цвет статуса, но вы также можете выбрать черный (Black) или прозрачный черный (Translucent Black), если они лучше подходят для вашего приложения.

Библиотека объектов

Если панель утилит на правой стороне окна не видна, ее можно включить, зайдя в View > Utilities > Show Utilities. На панели утилиты (Utilities) посмотрите на нижнюю панель под названием Object Library. Там есть выпадающее меню с пунктом «Objects» в начале списка. Если вы не смогли их найти, вы можете зайти в View > Utilities > Show Object Library.

Из выпадающего меню Object Library, найдите и выберите Windows & Bars. Теперь нажмите на Navigation Bar (панель навигации), перетащите ее в окно просмотра и поместите непосредственно под черной cтрокой состояния Status Bar (это которая с индикатором аккумулятора). Мы можем настроить название и описание панели. Дважды щелкните на текст, где написано «Title», и вы увидите ярлык «Title» на панели утилит, где вы можете изменить название описание, например «Тест». Нажмите «Enter», посмотрите, что получится.

Опять в панели Windows & Bars прокрутите вниз, чтобы найти панели вкладок Tab Bar, а затем перетащите ее в окно просмотра и поместите ее в самом низу вашего приложения. По умолчанию эти два элемента выглядят отлично.

Теперь, может быть, вы хотите, чтобы градиент панели навигации сочетался с панелью вкладок в нижней части, и для этого вы можете нажать на панель навигации и посмотреть справа на панель Attributes в панели Utilities. Самая первая опция называется Style, который установлен по умолчанию. Измените стиль c дефолтного на Black Opaque, и ваши цвета будут сочетаться.

Давайте также добавим еще одну кнопку вкладок в нижней строке приложения. Наведите курсор мыши на панели Windows & Bars, и прокрутите вниз до Tab Bar Item, прямо под панелью вкладок. Перетащите его в ваше приложение, и поместите между 2 существующими кнопками на панель вкладок. Если вы дважды щелкните на эту кнопку, вы можете увидеть некоторые дополнительные опции в панели Utilities, здесь вы можете изменить изображение элемента и название. Например, в нашем примере название изменено на «Bookmark» для только что добавленного элемента панели вкладок.

Вы прочли краткое руководство по дизайну в Xcode. Это не очень сложный процесс, но вам потребуется немного времени, чтобы привыкнуть к интерфейсу. Попробуйте добавить несколько других элементов, чтобы почувствовать себя более уверенно, а также вы можете посетить Apple’s iOS Development Resources для получения более подробной, ведь это никогда не помешает!

Не забудьте про Часть 2

На этом мы завершаем первую часть руководства по дизайну приложений для iPhone. В следующей части мы расскажем об Objective-C и Cocoa Touch, и вы научитесь создавать работающие приложения для iPhone, так что следите за новостями! UPD часть 2

Примеры дизайна для IOS

Дабы вдохновить вас к новым свершениям, прилагаю подборку отличного дизайна для iPhone- приложений.
Race Splitter

Satisfaction Remote

Tweetbot for iPhone

Reeder

Foursquare

MailChimp

Instagram

Joystiq

Piictu

Darkness

via

Читателям также нравится:

Обратите внимание!

Запущена новая версия сообщества для творческих людей — TopCreator, которое мой блог всячески поддерживает. Мы верим, что проект нужен российским дизайнерам, иллюстраторам и фотографам — мы хотимы быть вам полезны! Очень интересный проект, будьте среди первых. Заходите сюда

Комментарии

  1. 07 Мар
    iDrugov

    Круто. Жаль что я не программирую =)

  2. 11 Мар
    Анна

    Может подскажите, где можно найти дизайнера интерфейсов? IAuto

  3. 11 Мар
    naikom

    Ну есть, к примеру, различные сайты фриланса.

  4. 21 Мар
    Simon

    а еще есть гугл, и есть я, например :)

  5. 26 Мар
    Lelique

    А еще хочется уже увидеть вторую часть поста =)

  6. 03 Апр
    Дмитрий

    Спасибо!!!А когда выйдет вторая часть???

  7. 03 Апр
    naikom

    Думаю, в ближайшие 2 недели

  8. 04 Апр
    Juli

    Спасибо, очень ясно описано! Очень жду вторую часть!

    Интересует почему выбран тип проета «Single View Application» и от каких условий зависит выбор?

  9. 04 Апр
    naikom

    Будьте внимательны, это перевод!)

  10. 21 Май
    spdif

    Можно ссылку на оригинал статьи?

  11. 21 Май
    naikom

    Конечно) В конце каждой статьи есть ссылка на оригинал
    Что-то в переводе вызывает сомнения?

  12. 22 Май
    Юлия

    Анна, по поводу дизайна интерфейсов, свяжитесь со мной, пожалуйста — skype id: veselskaya.yulia .
    Спасибо!

  13. 12 Июл
    Али

    А скоро будет — Часть 2?

  14. 12 Июл
    naikom

    Вышла, уже давненько

  15. 19 Июл
    Али

    Ссылочку можно??

  16. 19 Июл
    naikom

    Вбейте в поиск сайта и получите ссылочку. Совсем не сложно)

  17. 19 Июл
    naikom

    Прошу прощения, видимо не опубликовал. В черновиках валяется. Постараюсь на выходных отредактировать и опубликовать.

  18. 23 Июл
    Али

    Спасибо, ждем))

  19. 12 Авг
    Severnij

    По прежнему ждём

  20. 02 Янв
    naikom

    Вышла, наконец, часть 2 http://naikom.ru/blog/archives/6538

  21. 20 Май
    Артур

    Подскажите, т.е. на Windows нельзя сделать приложения для iOS. Верно?

  22. 20 Май
    naikom

    Точно не могу сказать, попробуйте найти в гугле, возможно, есть способы

Оставить комментарий:

Anti-Spam Protection by WP-SpamFree


  • Kevin Durant Shoes
  • Lebron Shoes
  • Lebron James Shoes
  • Nike Lebron James Shoes
  • Derrick Rose Shoes
  • D Rose Shoes
  • KD 7 Shoes
  • Kobe X Shoes
  • Kobe 10 Shoes
  • KD 7
  • Kevin Durant Shoes
  • KD Shoes
  • Nike KD Shoes
  • Kobe 10 Shoes
  • Discount Kobe Shoes
  • Kobe Shoes
  • Kobe Bryant Shoes
  • KD 7 Shoes
  • Kyrie Irving Shoes
  • Lebron 12
  • Lebron James Shoes
  • Lebron Shoes
  • Nike Free
  • Nike Free Run
  • Air Max Shoes
  • Cheap Air Max Shoes
  • Lebron James Jersey
  • Kobe Bryant Jersey
  • Kevin Durant Jersey
  • Air Jordan Shoes
  • Michael Jordan Jersey
  • Blake Griffin Shoes
  • Russell Westbrook Shoes
  • Rose Shoes
  • Kobe Bryant Jerseys
  • Lebron James Jerseys
  • Kobe Bryant Jersey
  • Lebron James Jersey
  • Supra Shoes
  • Kyrie 1 Shoes
  • Nike Free 5.0
  • Nike Free 5
  • kevin durant shoes
  • kd 7
  • kd new shoes
  • KD Shoes
  • Kyrie 1
  • Jeremy Scott shoes
  • Jeremy Scott Adidas
  • Tenis Adidas Springblade
  • Kevin Durant Shoes
  • Kobe Bryant Shoes
  • KD Shoes Store
  • KD Sneakers
  • Lebron Basketball Shoes
  • Adidas Porsche Design
  • kd shoes
  • Cheap Herve Leger Dress
  • Cheap Lebron Shoes
  • Adidas Porsche Design
  • Lebron James Shoes
  • Coach Retail Store
  • nba jerseys
  • louis vuitton handbags
  • Cheap Lebron 11
  • Kobe Bryant Shoes
  • Kevin Durant Shoes
  • louis vuitton belts
  • kobe shoes
  • Lebron James Shoes
  • Kevin Durant Shoes
  • Los Angeles Clippers Jerseys
  • Toronto Raptors Jerseys
  • kd 6
  • kd 7
  • kobe 9
  • Kyrie 1
  • Nike Kyrie 1
  • Kyrie 1 Shoes
  • Kyrie Irving 1
  • KD Shoes
  • Lebron James Shoes
  • KD 7
  • Westbrook Shoes
  • Lebron Shoes
  • Lebron James Shoes
  • Air Max Shoes
  • kobe bryant shoes
  • Derrick Rose Shoes
  • Rose Shoes
  • KD 7
  • Kobe X
  • Kobe 10
  • Lebron Shoes 12
  • kyrie irving shoes
  • Nike KD Shoes
  • Cheap Nike Free
  • Nike Free
  • Lebron 12 Shoes
  • Cheap Air Max
  • Cheap Lebron Jerseys
  • Kobe Bryant Jerseys
  • Kevin Durant Jersey
  • Kobe Shoes
  • Griffin Shoes
  • Michael Jordan Jerseys
  • Kobe Jerseys
  • Lebron Jerseys
  • Kobe Bryant Jerseys
  • Lebron James Jerseys
  • Cheap Supra Shoes
  • Supra Shoes
  • Nike Kyrie 1
  • Nike Free Shoes
  • Nike Free Run
  • KD shoes
  • Kyrie 1 Shoes
  • Kevin Durant Shoes
  • Jeremy Scott Wings
  • Jeremy Scott Shoes
  • Lebron James Shoes
  • Adidas Porsche Design
  • Kobe Shoes
  • Cheap Kevin Durant Shoes
  • Kevin Durant Shoes
  • Lebron 11
  • Porsche Design Adidas
  • Cheap KD Shoes
  • Lerbon James Sneakers
  • Cheap KD Shoes
  • Herve Leger Dress
  • Lebron Shoes
  • Porsche Design Shoes
  • Lebron Shoes
  • Nike Shoes
  • Cheap Coach Bags
  • louis vuitton purses
  • cheap nba jerseys
  • Lebron James Shoes
  • Cheap Kobe Shoes
  • Kobe Shoes
  • KD Shoes
  • KD Shoes
  • Sacramento Kings Jerseys
  • Washington Wizards Jerseys
  • Air Jordan Shoes
  • kd 6
  • kd 7
  • kobe 9
  • Kyrie 1
  • Nike Kyrie 1
  • Kyrie 1 Shoes
  • Kyrie Irving 1
  • Lebron James Shoes
  • Lebron 12
  • Lebron 11
  • Kobe Shoes
  • cheap kobe shoes
  • lebron 12 shoes
  • James Shoes
  • Lebron Shoes
  • Rose Shoes
  • Derrick Rose Shoes
  • Kobe 9
  • NIke KD
  • KD VII
  • KD Shoes 2015
  • kyrie shoes
  • Air Max 90
  • Air Max Shoes Sale
  • Nike Free Shoes
  • Nike Free Run 2
  • Lebron 12
  • Lebron Jerseys For Sale
  • Cheap Kobe Jerseys
  • KD Jersey
  • Jordan Jersey
  • Jordan Griffin Shoes
  • Kobe Bryant Jersey
  • Lebron James Jersey
  • Supra Footwear
  • Supra Shoes
  • KD Shoes
  • Kyrie irving Shoes
  • Nike Free Run Shoes
  • nike free run 5.0 women
  • KD Shoes
  • Kyrie Irving Shoes
  • Kevin Durant Shoes
  • KD Shoes
  • Kobe Shoes
  • Kobe Shoes
  • Adidas Wings
  • Kobe Bryant Shoes
  • Porsche Design Adidas
  • Cheap Kobe Shoes
  • KD 6
  • Cheap Westbrook Shoes
  • Kevin Durant Shoes
  • Adidas Porsche Shoes
  • Cheap Lebron James Shoes
  • Kevin Durant Shoes
  • Herve Leger Outlet
  • Lebron James Shoes
  • Adidas Porsche Design Bounce
  • Nike Lebron Shoes
  • Coach Outlet
  • nba jerseys for sale
  • louis vuitton bags
  • Air Jordan 29
  • Nike Lebron Shoes
  • Nike Kobe Shoes
  • Cheap Kobe Shoes
  • Cheap KD Shoes
  • KD 6
  • Utah Jazz Jerseys
  • Philadelphia 76ers Jerseys
  • Air Jordan Shoes
  • kd 6
  • kd 7
  • kobe 9
  • Kyrie 1
  • Nike Kyrie 1
  • Kyrie 1 Shoes
  • Kyrie Irving 1
  • Cheap Lebron Shoes
  • Lebron New Shoes
  • James Shoes
  • Cheap Lebron 11
  • Lebron James Shoes
  • KD 7
  • Adidas Rose Shoes
  • Rose 5
  • NIke KD 7
  • irving shoes
  • KD Shoes
  • Kobe 9
  • Air Max 95
  • Air Max 2014
  • Nike Free 3.0
  • Nike Free Run 3
  • lebron shoes for sale
  • kobe 2014
  • Cheap Lebron James Shoes
  • Kobe Jerseys
  • Kevin Durant Jerseys
  • Jordan Jerseys
  • Cheap Griffin Shoes
  • Jordan Westbrook Shoes
  • Kobe Jersey
  • Lebron Jersey
  • Supra Online
  • Supra Shoes
  • Kyrie 1
  • Irving Shoes
  • Kyrie Shoes
  • Nike Kyrie 1
  • KD Shoes 2015
  • Kobe Shoes 2015
  • Kobe Shoes 2015
  • Kevin Durant Shoes
  • Nike KD Shoes
  • Nike Kobe Shoes
  • Nike Kobe Shoes
  • Adidas Jeremy Scott
  • Adidas Jeremy Scott
  • KD Shoes
  • Adidas Springblade Shoes
  • Kevin Durant Shoes
  • nba jerseys 2015
  • Porsche Design Shoes
  • KD 6
  • KD Shoes Sale
  • Lebron James Shoes
  • Lebron James Shoes
  • Cheap KD Basketball Shoes
  • Herve Leger Bandage Dress
  • Adidas Porsche Bounce Shoes
  • Cheap Lebron Shoes
  • Cheap Coach Handbags
  • Louis Vuitton Bags Women
  • louis vuitton outlet
  • Kobe Shoes
  • Cheap Jordan Shoes
  • Lebron Shoes
  • Lebron Shoes Sale
  • Kobe Shoes Sale
  • Kobe Bryant Shoes
  • Lebron James Shoes
  • KD 6 Shoes
  • Boston Celtics Jerseys
  • New Orleans Pelicans Jerseys
  • kd 6
  • kd 7
  • kobe 9
  • Kyrie 1
  • Nike Kyrie 1
  • Kyrie 1 Shoes
  • Kyrie Irving 1
  • Lebron James Shoes
  • Lebron 12
  • Cheap Lebron Shoes
  • Lebron Basketball Shoes
  • Cheap Lebron Shoes
  • D Rose Shoes
  • Rose 5.0
  • KD Shoes
  • kyrie irving shoes
  • Nike Air Max Shoes
  • Nike Air Max
  • Nike Free 5.0
  • Nike Free Womens
  • nike lebron 12
  • kobe shoes 2014
  • Cheap Lebron Shoes
  • KD 7 EP
  • KD 2014
  • Kevin Durant Shoes
  • Lebron Jerseys
  • Lebron James Jerseys
  • Kobe Bryant Jersey
  • Kobe Jerseys For Sale
  • Kobe Jerseys Sale
  • KD Jerseys
  • Cheap Jordan Jerseys
  • Hyperdunk Griffin Shoes
  • Westbrook Shoes 2015
  • Nike Kobe Jersey
  • Lebron Jersey For Sale
  • Nike Supra
  • Supra Shoes
  • Kyrie 1
  • nike free run 5.0 women
  • nike free run women
  • Cheap Kyrie 1
  • Cheap Kyrie Shoes
  • Kyrie Shoes 2015
  • Adidas Shoes
  • Lebron Shoes
  • Porsche Design Shoes
  • Kobe 8
  • KD Shoes
  • Cheap Kevin Durant Shoes
  • Lebron Shoes
  • nba jerseys 2014
  • kd Shoes nba
  • Herve Leger Bandage Dress
  • Nike Lebron 11
  • louis vuitton sale
  • Kobe Bryant Shoes
  • Air Jordan Shoes
  • Cheap Lebron James Shoes
  • Kobe Shoes Sale
  • Lebron Shoes
  • Miami Heat Jerseys
  • Los Angeles Lakers Jerseys
  • kd 6
  • kd 7
  • kobe 9
  • Westbrook Shoes Sale
  • Kyrie 1
  • Nike Kyrie 1
  • Kyrie 1 Shoes
  • Kyrie Irving 1
  • Cheap Lebron Shoes
  • Lebron James Shoes
  • Lebron James Shoes Sale
  • Lebron James Jerseys
  • Cheap Rose Shoes
  • Rose 5 Shoes
  • Nike Free 6.0
  • Nike Free Sale
  • Kyrie Shoes Sale
  • KD Shoes
  • Air Max 2014
  • Air Max 90
  • cheap lebron shoes
  • lebron shoes
  • Lebron James Jersey
  • Lebron Shoes
  • Cheap KD Jerseys
  • Kevin Durant Jersey For Sale
  • Kobe Shoes
  • Jordan Jersey sale
  • Jordan Blake Griffin Shoes
  • Russell Westbrook Shoes Sale
  • official supra shoes
  • Porsche Design Shoes
  • Cheap Jeremy Scott Wings
  • Kobe Shoes sale
  • Lebron Shoes
  • Herve Leger Sale
  • nba jerseys sale
  • Coach Wallets
  • cheap louis vuitton handbags
  • Air Jordan
  • Nike Lebron Shoes Sale
  • Kobe 9
  • Kyrie 1
  • Kyrie 1
  • Kyrie 1 Shoes
  • Kyrie Irving Shoes
  • Irving Shoes
  • nike free run 5.0 men
  • nike free shoes on sale
  • Supra Shoes
  • LV Handbags Men
  • Kevin Durant Shoes
  • KD VI
  • Adidas Shoes
  • San Antonio Spurs Jerseys
  • Chicago Bulls Jerseys
  • kd 6
  • kd 7
  • kobe 9
  • Kyrie 1
  • Nike Kyrie 1
  • Kyrie 1 Shoes
  • Kyrie Irving 1
  • Kevin Durant Shoes
  • Lebron Shoes Sale
  • Lebron Shoes 2015
  • Lebron 12
  • Lebron James Shoes
  • Rose New Shoes
  • Rose Shoes 2015
  • Lebron Shoes 2015
  • Lebron 12
  • Lebron Jerseys sale
  • Nike kyrie shoes
  • Adidas Derrick Rose
  • Adidas Store
  • Adidas Shoes
  • Adidas Derrick Rose
  • lebron james shoes
  • Nike Kyrie Shoes
  • Kyrie irving Shoes For Sale
  • Lebron James Jersey
  • Kobe Bryant Jerseys
  • Kobe Jerseys For Sale
  • Kobe Jerseys Sale
  • Supra Shoes
  • Russell Westbrook Shoes
  • Kobe Jersey Sale
  • Cleveland Cavaliers Lebron Jersey
  • OKC Jersey
  • Nike Lebron Shoes
  • Lebron James Basketball Shoes
  • Kevin Durant Shoes
  • Herve Leger Bandage
  • Griffin Shoes Sale
  • nba jerseys store
  • Lebron Shoes 2014
  • cheap louis vuitton bags
  • Cheap Kobe Jersey
  • Lebron Jersey 23
  • Jordan Shoes
  • official nba jerseys
  • NBA Stars Basketball Shoes
  • KD Shoes
  • Air Max Shoes 90
  • Air Max 95
  • KD 2014 Shoes
  • KD For Sale
  • Nike Shoes
  • Nike Free
  • Kyrie 1
  • Kyrie 1
  • Kyrie 1 Shoes
  • Kyrie Irving Shoes
  • Irving Shoes
  • Phoenix Suns Jerseys
  • Customized NBA Jerseys
  • Jordan Shoes
  • kd 6
  • kd 7
  • kobe 9
  • Bulls Jordan Jersey
  • Kyrie 1
  • Nike Kyrie 1
  • Kyrie 1 Shoes
  • Kyrie Irving 1