Webmasters Gallery

One of NYC’s finest designers is Roberto Blake who just so happens to also run a small YouTube channel with advice on the design industry.

Recently I stumbled onto this great 13min clip that covers crucial info about marketing yourself and being the kind of person that creative directors want to hire. I know the title seems really generic, but the content itself is phenomenal – especially for people fresh out of design school. You can stream the video for free right off YouTube.

Some of the key concepts & ideas he mentions are:

• How to Get Hired as a Graphic Designer
• How to Get Graphic Design Clients
• How to Market Yourself Effectively as a Designer in the Current Era
• How to Find Inspiration as a Graphic Designer
• How to Be Successful as a Graphic Designer

I’m not intimately familiar with Roberto Blake or his work, but I have to say this is one seriously helpful video. Whether you’ve gone to college or not these tips ring true for all fields of design including print, illustration, animation, and in some cases even development.

The most important concept to remember is likability. Sell your work but also really try to sell yourself as someone that people want to work with. That’s the secret to getting a 2nd interview callback or building a network of trusted freelance clients.

In truth, all of his tips are essential to the business of design. This is something you won’t always learn in college but will always be a big part of any creative career path.

Designers can always benefit from well-crafted freebies made for all digital design projects. Icons are often particularly useful since they require a lot of time and a consistent style to blend nicely with a layout.

These unique print icon vectors have been released by Brusheezy for free under Creative Commons. Designers are allowed to download and manipulate these icons for any work, personal or professional, as long as the initial license remains in-tact.

Download Now!

All of these icons are vector-based including all filetypes from EPS, AI, PSD, SVG, and of course regular-old bitmap PNGs.

If you’re interested be sure to download this pack exclusively from Web Design Ledger. I’d like to offer thanks to Brusheezy and all the designers on the Eezy team working hard to release quality freebies.

To find more awesome freebies be sure to check out Brusheezy on Facebook and on Twitter @brusheezy.

The vast significance and impring that WordPress has left on the design community is practically incalculable. It’s one of the most popular open source CMS engines for building any website from a simple blog to a business with e-commerce capabilities.

Jonathan Torke is a professional web designer & developer who recently broke out into launching his own professional WordPress theme site JotoThemes. In this interview we cover a little about Jonathan’s background and how he got started as a developer, later delving into the complexities of WordPress and his tips for young developers on how they can improve their knowledge of WordPress theme construction.

Q: Can you share a little about your history working on the web? How did you get into building websites & what kept you interested in the field?

One year after finishing school I started work in 2008 in a young online business. At first I had designed flyers and screen designs. I had no idea about how to write HTML, CSS, or PHP. But I had great support from the management.

The technical knowledge of web design and the administrative aspects I could catch up with very quickly.

Starting with Joomla and Drupal I was immediately fascinated by template design. This fascination grew into a substantial part of my life, both professionally and privately.

Eventually the company needed a multisite system for various projects. I was looking for the solution, and so I came to WordPress.

It was finally the solution for multi-site systems which were also easy to maintain. WordPress captivated me from the very beginning. That was a major turning point.

Q: Why did you gravitate towards WordPress theme development? And why did you choose WordPress over another CMS like Drupal?

Before I discovered WordPress I worked exclusively with Joomla and Drupal.

Joomla was complicated and the user interface was overloaded. To create multilingual menus was very difficult (to name just one example). When facing problems that could not be answered by the community, it took a long time for me to locate competent solutions.

With Drupal I actually had a very positive development experience. It was so easy to realize very complex systems with a large number of members. Drupal gives you a big empty house with solid ground. Drupal allows you maximum freedom. The only limiting factors are your ideas and creativity.

But Drupal updates were tedious, not to mention the setup required a lot of preparatory work and time. For example, you had to install modules for the use of a text editor or to integrate media into webpages.

Also Drupal maintenance took a lot of time and often got on my nerves. Because of this I have not worked with Drupal for serval years.

Today I’m certain Drupal would be much better than it was til 2011.

WordPress is just much easier to use and easier to program. The WordPress Codex is very logical and the theming structure is very clear.

Q: How did you get the idea for JotoThemes & how long has it been online?

JotoThemes is very young. The website first launched in mid-April of 2015.

I had worked for several years as a web designer and front-end developer. During that time I had many different tasks, but my greatest passion was online marketing and creating CMS templates (Joomla, Drupal, and WordPress). With WordPress I had the most fun.

I just could not stop working on themes. Even in my spare time I spent countless hours trying to understand and love WordPress. At that time I wanted to do nothing more than create WordPress Themes.

At the company where I worked we eventually moved from Joomla to WordPress, and we slowly became experts on WordPress sites.

In 2011 i was finally allowed to completely specialize on developing WordPress Themes. In autumn of 2012 I started this idea of WordPress theme development on paper & worked out a business plan.

In spring 2013 I had started my own business. And 18 months later I published my first WordPress Theme on jotothemes.com. The second theme is already in development.

Q: How do you choose which features to add into each theme? Do you always include WP features like shortcodes, custom widgets, etc?

Over the past few years I’ve been working on customer sites and have talked with many customers about their wishes. During this time I’ve learned which functions are often needed for certain websites.

In addition I run my own websites. As a blogger(http://pixeltuner.de/) I look at each theme from the user’s perspective, and not from the perspective of a developer. This reminds me of which features I find most useful while blogging.

These can be small things like any of these ideas:

• disable the sidebar or header
• show a visitor count on a page/pages
• link Twitter usernames when mentioned
• reserve Premium content for logged in users
• or e-mail address encryption

My Theme library includes more than 40 different shortcodes to allow such functions.

Other additional functions such as colors, font settings, Google Analytics tracking code, 1-Click Child theme Auto Installer and much more can be enabled+configured in the Theme Settings area.

We also have many additional features that you can show via widgets such as Customer Testimonials, popular social networks, a Flickr-powered photo gallery, custom calendar, recent comments and a whole lot more.

Q: What’s your typical workflow from start-to-finish for building a new WordPress theme?

At the beginning I create the layout and design with Photoshop. Then I program the theme.

Basically, my themes consist of two components:

1. A self-made basic theme, including templates
2. A library/framework with a variety of useful options and plugins. The theme library is integrated into the functions.php file.

Q: It also looks like some of your themes support WooCommerce. What are your thoughts on WooCommerce? Do you think it can compete with eCommerce CMS’ like Magento?

If you‘re planning a larger series of products when you start an online store, then you should rely on the system with the largest possibilities. If your online business’ e-commerce needs are generally limited, then WooCommerce offers a quick & easy solution.

Both systems have their pros and cons.

In summary it can be said that the website owners can accomplish quite a lot alone with WooCommerce. While Magento makes professional help needed due to its complexity and its own structure, WooCommerce works completely in the frame, which is specified by WordPress and is considered a lightweight application.

Q: Are there any designers or particular websites that inspire your own work?

There are so many creative minds out there. It’s very difficult to decide on certain designer.

Let me say that I am open to anyone with good ideas.

Q: Do you have any resources or tips for a frontend developer who wants to learn how to build WordPress themes? Where would you suggest they start?

As a WordPress theme developer you should have fun while learning to write code.

The most important languages are:

• HTML: This is the context in which all page elements are housed
• CSS: Ensures that HTML looks pretty. Your theme design will depend on CSS to stand out from all the other themes.
• JavaScript: JS Fundamentals are useful to know because WordPress works with JS scripts & plugins. JavaScript can be used within theme files and Child Themes.
• PHP: To be able to write any CMS code in WordPress, you need PHP. WordPress is built on PHP with its own internal functions and classes.

You cannot know everything, especially not at first.

Beginners only need to know where to get their questions answered. With a bit of research you’ll find many well-known free online resources such Tuts+ or Treehouse, along with many others.

The best way to become a good WordPress theme developer is by simply doing it. To understand what‘s important in Theme Development, try to build a few themes from scratch.Use simple Photoshop web design templates and try to remake them into a WordPress theme.

Note: Start with a very simple design (header, main content, sidebar, footer), nothing too complex. Frameworks such bootstrap are very useful when creating mobile friendly WordPress themes.

I always start with a piece of paper and sketch the layout. Then I create a design in Photoshop for the homepage & internal pages before I even write my first line of code. This is vital so that I can visualize my design idea before trying to make it.

Plus making updates is a lot easier and faster using Photoshop rather than code.

My proven method is: Sketching -> Mockups -> Screen Design -> Code

In summary:

• Learning by doing. Do not be afraid of doing something wrong. Start out by editing a simple WP install, either locally or on a test server. Never on a live site.
• In the beginning work locally to save on server resources. Use tools such as MAMP or XAMPP.
• Start with a good Blank Theme. I recommend a starter theme such as Underscores(_s)
• Reference the WordPress Codex: https://codex.wordpress.org/Theme_Development
• Learn from the community. WordPress is famous for its large and active community. If you have questions, turn to them. You’ll often receive competent answers in a very short period of time.

Q: Do you still have time to practice & improve your skills? Are there any new techniques or dev languages you hope to learn?

It’s not about time. It’s about hurdles that must be overcome in order to reach a next higher level.

The technical requirements are becoming more complex. At first I was up all night long busy optimizing websites for IE 6. Today all mobile devices must be integrated into the web design as well. And the most important thing is to ensure optimum performance.

If I need to learn a new dev language for that goal or to improve my skills, I do so with great joy. In this way I multiply my knowledge and experience to build a better version of myself.

Although web technology is becoming more complex, the beauty of it is that you’re not alone with your problems. Today there are more and more tools, frameworks, and libraries provided for free by enthusiastic developers. Open source has truly changed the way we build websites.

Q: In your opinion what changes do you think we’ll see over the next 3-5 years in the field of web design/development?

Overall I find it very difficult to assess trends for the next 3-5 years. Technologies are becoming more complex. Every innovation is difficult to learn and becomes obsolete within a few years.

I think that WordPress themes are increasingly no longer built the old way (quasi from zero).

Frameworks, Theme generators, and libraries deliver excellent preparatory work into which developers can incorporate their skills and ideas. These tools include default web standards to considerably optimize the workflow.

Although web projects can’t be realized that much more more quickly, there is more time for quality assurance. The future will show that there will be less bad design, bad code, and overall fewer bad projects.

The job of a web designer initially suffered bad reputation and has recently gone through a re-professionalisation.

Times have changed in our favor and the demand continues to grow. Customers and users are now increasingly able to recognize good quality work. Customers do not just want a website – they want a responsive, well-designed & well-maintained website.

Q: And finally can you offer some parting advice for other web designers/developers?:

Don’t invest too much time in the planning of ideas. Start today, so that your visions become reality tomorrow.

Have you thought hard about working as a web designer or WordPress theme developer? Today is the perfect day to start. And if you’ve already started, now is the best time to test your current knowledge, improve your abilies, and continue to learn. Open your eyes to new ideas. Look at old things from a new perspective.

As a web designer, theme developer, or any other kind of designer/developer you will find your future in this industry if you’re willing to continously improve yourself.

Your job should be fun. And that’s the point – doing something that you believe & that you love. No matter how bad your future looks in this industry, hard work & perserverence will ensure that you’ll find your place in it.

---

Many thanks to Jonathan for taking his time out for this great interview. If you’d like to learn more about him you’ll find info on his personal website Pixelturner(German), or you can follow him on Twitter @jonathantorke.

Shared Styles, Text Styles, and Symbols in Sketch App bare a striking resemblance to the way that we use CSS classes in web design. They let us reuse sets of already-defined styles in an effort to save a few seconds in our workflow.

But there is one flaw in this concept that I find to be the most annoying thing: the variable.

Let’s say that you’ve designed a button in Sketch App. It’s red with rounded corners and a slight shadow. You convert this to a Shared Style because you’ll need to use this button numerous times throughout the website design.

Later on you decide that you need a blue button as well. Knowing that you can’t reuse the shared style because that button is red, you start to recreate the button’s styles from scratch – a workflow that often becomes very dull over time.

The only variable is the fill colour.

So here’s what you do.

You add the shared style anyway, where in this case your blank shape would now be a red button, and then you remove it instantly. Your shape will retain the styles of the red button but it will no longer be tied to the “Red Button” shared style.

You’re now free to change the background colour and even add a completely new shared style to it – for example “Blue Button”.

And this is how we borrow styles from similar Sketch layers in order to create styles that are near-identical. Very handy if you’re copying styles many times over!

The SmartWeb Conference is an annual get-together for European designers and web developers. It’s a way to share new insights about the industry and meet other creatives residing in nearby countries.

In 2015 SmartWeb will be hosted in Bucharest, Romania. It’s only a one-day event so it’s not meant to be a huge get-together. But it is meant to be a great way to network and learn new ways of thinking without having to give up an entire weekend.

But those who would like to get some extra practice in can sign up for workshops which occur the day before on Sept. 21^st. So far the only scheduled workshop is “Advanced Sass” by Roy Tomeij. All other scheduled talks will be held on September 22nd in the Marriott Hotel.

With only one day to fit in 6+ talks you’ll want to be prepared! A laptop or notebook for taking notes is critical. Anything else you might use for practice or to show others would be great to bring along.

As of now tickets are still available. You can order the single-day conference tickets, the pre-event workshop, or both together. Anyone in the area of eastern Europe with an interest in a quick 1-day event shold definitely check out SmartWeb.

If you can’t make it this year be sure to follow updates on Facebook or on Twitter @smartwebconf.

A common thread amongst all humans is that we seem to adore pizza, and that we all like the feeling of progress. It feels good to know you’re getting somewhere and it feels even better to see the visual representation of that progress. And so the cherished progress bar interface was born.

From signup pages to eCommerce checkouts these progress indicators share details of our completion with each step. Yet designing your own interface from scratch can be more than a hassle. Much like buying a pre-made frozen pizza, you could also get a delicious pre-made progress bar design. The difference is that all these designs are completely free to download and use for any project. Talk about a real bargain!

Green Stripes

Multi-Colored Bars

Pink Circles

Simple Progress Bar

Shiny Gloss

Gradients

Green Glossy Bar

Blue Stripes

Slider

Blue Circle

Progress Slider

Uploader

Flat Percentage Bars

OS X Blue

Simple UI

Loading Circle

Status Loader

Thin Blue Stripes

Glowing Sparkles

Skills Progress

Circular Percentage

Orange Loader

Grey Loading Bar

Striped Bars

Shiny Blue

Percentage Bars

Apple’s recent San Francisco event contained a whole lot of ravishing information for tech enthusiasts. But for business and marketing people, one fact mentioned by Tim Cook should stand out even more: China’s iPhone market has grown by 75% year-over-year.

This figure includes all of the Chinese mainland(including Hong Kong) along with Taiwan. Looking back to Q3 of September 2014 Apple has seen an increase of 112% in revenue from these geographic locations. And that’s only looking back at the iPhone 6 sales!

Going forward there may be a general slowdown as China’s economy may follow suit. But it seems that many people in China are fascinated by this mobile tech and wish to put their money into these areas of technological innovation.

This info was covered by Tim Cook in the Sept 9th Apple event which you can watch in full on YouTube, or from Apple’s website. To learn more about this you might also check out the related post on TechCrunch

• Manifold.JS: How to Build a Hosted Web App on Android, iOS, and…
• WebDev: Creating a Mobile App with Famo.us and ManifoldJS
• WebDev: How to Use NGROK to Test a Local Site for Microsoft Edge and…
• Essential: How to Test Internet Explorer on Android, iOS, and Mac OS X
• Why we Made Vorlon.js and How to Use it to Debug Your JavaScript…
• Understanding ECMAScript 6: Template Strings (#2)