HTC

HTC, as one of the major players in the mobile industry, has a very nice website targeted to a variety of users. As soon as you get to the site, you are sent to a local version where the latest devices were displayed. Detecting the location of your visitor and then serving the content in native language helps companies in getting a high conversion rate.

The language indicator is positioned in the top right side. This enables the user to easily see the current language and provides him with a quick and intuitive way to change the language of the site. After clicking the language selector, we are sent to a whole page dedicated to all available languages. This is an easy task to complete and quite elegantly crafted.

Samsung

Compared to HTC, Samsung has a different position for the language selector. This is situated in the bottom left side and it also provides the user with a new visual indicator – country flag. In this case we are sent as well to an entire page where all available languages together with countries’ flags are listed.

Blackberry

To keep the tradition going, even in the case of Blackberry we are redirected to a local translated page. Now to break the tradition, the landing page is far from usable when it comes to language selector.

So, in order to get rid of that landing page you have to click on the logo that will send you to a full size language selector page. This kind of workflow is far from usable. Users with less technical background will never click on the logo even if it is a common practice when designing websites.

On much important sub-sites (UK, US …), Blackberry provides a language selector in the lower left side. Usable, but hardly visible.

HP

The biggest PC maker in the world, HP has one of the most visited websites. With that kind of responsibility on its shoulders, HP did a good job providing the user with a language option on the first page. The component is situated in the bottom left side and apart from the country flag we have also a tiny globe icon.

This is one of the most emphasized controls on corporate websites. Too bad that on secondary pages you have nothing like that, the language selector being vanished.

Lenovo

Logos are by far some of the most exposed elements in a website. Apparently Lenovo knows this, otherwise I can’t explain placing a languages drop-down list in the right side of the logo. The strange thing is that it looks good, is highly usable and it’s not visually obstructive. Another nice thing is that Lenovo has invested time and resources in order to have all local sites based on the same layout and design.

Acer

The second largest PC maker, Acer proves to be one important player when it comes to multilingual yet usable site. From the first time, you are asked to select your country and then you are redirected to your selected local site. What I like about Acer, is that although not all the content is translated, most of the local versions have the same design.

While on the your selected site, you are able to change the language by selecting the indicator situated in the bottom left side.

Microsoft

Even though this is one hated company, I can’t create this list of corporate sites without Microsoft. Microsoft provides its millions of users with a wide variety of languages. In this case we have a language selector placed in the top right side of the site, being part of the main menu. Once clicked, a drop-down menu appears covering countries with their languages. A pretty simple solution yet quite practical.

Oracle

Oracle provides a similar solution for multilingual site as Microsoft. A link positioned in the top side of the web page, though not emphasized, helps the user pick a different language. I would’ve liked to see maybe a simple flag there or a globe, in order to make up for the low font size.

SAP

SAP approach to a multilingual solution is nothing out of the ordinary. First you are prompted to select your region, then your country and after that you are redirected to your local site. Here, the language indicator is placed in the top side, being embedded into the main menu.

IBM

When you say corporate, IBM is one of the first three names that pop in your mind. So here we are, judging the “Big Blue” about its choices regarding languages. IBM may not be one of the first names that screams usability but you might reconsider that once you analyze how usable the languages approach is. The language indicator is placed in the top right side of the site, having a nice world map icon as a visual indicator. Once you click on it, you are taken to a dedicated page where you select your country from a drop-down list.

Analysis Conclusion

Apart from these listed companies, I’ve analyzed others as well ( Nvidia, AMD, Intel, Amazon … ), just that it doesn’t make sense to list all their details. Instead I will list some final numbers regarding languages selector in corporate websites.

Hope it helps in your future projects. Cheers!

So who are the major players in this evolving frontier, and what innovations do they bring to the market? Android, Apple, and Windows Phone 7 comprise roughly two-thirds of the mobile OS market.

Android’s operating system, now a fully-owned subsidiary of Google, features multi-touch technology, hardware connectivity, 3D graphics, and application multitasking. Since the acquisition in 2005, Android has successfully asserted Google as an authority in mobile technology, comprising 33% of global smartphone profits.

Apple has extended its iOS to incorporate a number of platforms, from the iPad to the iPod touch. While heavily proprietary, Apple’s pinch/zoom and swipe capabilities, seamless interface, and scores of immensely popular applications have earned them their 16% chunk of the mobile market.

Using their long established command of desktop operating systems as leverage, Microsoft entered the mobile OS arena with their Windows Mobile operating system. The OS has since evolved into the Windows 7 Phone system, integrating live tiles into the interface. The tiles, which constantly update themselves, represent e-mail, applications, and other running features so that the user doesn’t need to navigate a series of menus to check them. In addition to the interface, Windows 7 Phone features Internet Explorer 9, the Microsoft Office suite, and application multitasking.

Collectively, the competing carriers mentioned above have hastened the development of entirely new platforms, such as the tablet and the PDA.

Tablets have appeared to fill a niche market for those seeking a hybrid solution to their laptop/handset dilemma. Tablets feature touch screens, virtual keyboards, full web capabilities, and live streaming media, while maintaining a size and portability precisely between that of their brethren. The initial contenders were the Windows Tablet PC, a flop, and then the iPad. There are now dozens more such as the Toshiba Thrive, Samsung Galaxy, and HP TouchPad. Innovations in PDA technology include Wi-Fi hotspot capabilities, touch screens, and wireless synchronization.

Finally, no mobile OS succeeds without effective application development. Every prominent name in mobile technology creates and hosts thousands of applications per month. In conjunction with some devices supporting hardware, the latest applications can analyze blood alcohol content, recognize a melody, or even save shoppers money with instant price comparisons.

The real “WOW”

The first thing bouncing into my head when I saw the new Windows 8 User Interface was the similarity to Windows Phone 7 UI which is an awesome thing. With Windows Phone 7, Microsoft created a new user interface with its design language named Metro. Now it seems like MS borrowed the interface to Windows, making the OS feel more like 2015 rather than 2005. The only thing I can say is that Microsoft missed the WOW Vista campaign by 6 years.

Can’t wait for BETA

Microsoft really made me want to test this new thing, same way as it did with Windows 7. The only difference is that the new OS steps into the new era of personal computing – mobile, productive and … more personal. With this user interface and experience, Microsoft shows that Windows can be fun too.

Enjoy

Here is the link with the first official Windows 8 showcase: Windows 8
Here is a first glimpse on how the UI will look in the next installment of the most popular operating system for PC’s – Window 8. Enjoy!

1. ExpressionEngine

ExpressionEngine is a commercial product built on an Open Source foundation, giving you the best of both worlds. As a commercial product, ExpressionEngine is supported by a team of committed developers and technical support specialists. – ExpressionEngine

2. Textpattern

Textpattern is an elegant content management system that is free, open source software. Web designers, developers, publishers and bloggers love its flexibility and extensibility. It has a powerful, sophisticated engine that can be infinitely tuned to suit whatever type of web site you can imagine. Textpattern

3. Symphony CMS

Symphony is a web-based content management system (CMS) that enables users to create and manage websites and web applications of all shapes and sizes – from the simplest of blogs to bustling news sites and feature-packed social networks. – Symphony Cms

4. CMS Made Simple

CMS Made Simple™ is an open source ( GPL) package first released in July 2004. Its built using PHP that provides website developers with a simple, easy to use utility to allow building small-ish (dozens to hundreds of pages), semi-static websites. – CMSMadeSimple

5. Concrete5

Anyone can start making their own website in seconds, and the editing experience is easy; just click on what you want to change. Developers still get a flexible and robust framework for building sophisticated web applications. With concrete5, however, site owners will be able to make changes and additions on their own, for years to come. – Concrete5

6. Website Baker

Create new templates within minutes – powered by (X)HTML, CSS and jQuery. With WebsiteBaker it’s quite natural your site is W3C-valid, SEO-friendly and accessible – there are no limitations at all. Use droplets – the new and revolutionary way of inserting PHP code – everywhere you want. – WebsiteBaker

7. Umbraco

Umbraco is a free, open-source web cms built on the Microsoft .NET Framework. It is easy to use, simple to understand, and is highly extensible using industry-standard languages and patterns such as HTML, CSS, jQuery, and C#. Umbraco is powerful and flexible whether you’re a cutting-edge designer or a hard-core code junkie. – Umbraco

8. Contao

Contao has an intuitive user interface that uses Ajax and Web 2.0 technologies for optimal usability. Multiple back end languages and themes, a powerful permission system, versioning and undo management, advanced search and sorting options or the Live Update Service are just a few of many features that make Contao stand out from other CMS. The Contao front end is 100% template based and generates accessible XHTML strict output that meets the W3C/WAI requirements. – Contao

9. Plone CMS

Plone is excellent for application oriented jobs and Your Average PHP/Java CMS™ is good for page oriented jobs. If users of the system need to add, modify, and delete content, or if the content is not always table oriented, but requires a process, a workflow, and complex content types with business logic, Plone may be a better choice. – Plone

10. XOOPS

XOOPS is a web application platform written in PHP for the MySQL database. Its object orientation makes it an ideal tool for developing small or large community websites, intra company and corporate portals, weblogs and much more. – XOOPS

11. MODX

MODx provides a powerful framework on which to deploy and secure your website and web applications. For example, it gives you a true system for registered web users and groups that is separate from administration users. For content management, you can easily duplicate documents, folders (and all their children!), chunks and snippets. Most significant, though, is MODx’s ability to empower you to quickly and easily create and maintain a rich and dynamic website like never before. – MODx

12. Silverstripe

SilverStripe CMS is an open source web content management system used by governments, businesses, and non-profit organisations around the world. It is a power tool for professional web development teams, and web content authors rave about how easy it is to use. – SilverStripe

13. PyroCMS

PyroCMS is easy to use, looks great and uses some smart caching to keep everything running smoothly. It can be easily extended with Modules, Widgets, and Plugins which are easy to make thanks to CodeIgniter; and it can be customized with Themes, which are basic HTML with a few tags in place. – PyroCMS

14. GetSimple CMS

GetSimple is an XML based lite Content Management System. To go along with it’s best-in-class user interface, we have loaded it with features that every website needs, but with nothing it doesn’t. GetSimple is truly the simplest way to manage a small-business website. – GetSimple CMS

15. FuelCMS

FUEL CMS was built for developers that like to work in the CodeIgniter framework and need a lightweight, highly customizable CMS for their clients that integrates nicely with their code. If you are looking for a CMS first and are not familiar with CodeIgniter or comfortable writing code, then FUEL may not be a right fit. – FuelCMS

Other Alternatives

Do you have other CMS’ that you work with? Please comment and share with us your preferred content management system. Cheers!

1. Jon Hicks

Jon Hicks from Hicksdesign is the man behind many well-known logo designs like MailChimp, Shopify or Silverback. But Hicksdesign is responsible not only for great logos, but also great user interfaces and web designs for Mozilla, Opera Software and others.

Follow Jon Hicks on Twitter: Hicksdesign

2. Cameron Moll

I think Cameron Moll was one of the first designers that I admired when I started searching the web for inspiration. From well defined typography to great colors, Cameron’s designs are absolutely stunning. You can check Authentic Jobs or one of his great typographic posters to see Cameron’s style and execution.

Follow Cameron Moll on Twitter: Cameron Moll

3. Jason Santa Maria

Please tell me that you have heard about Alistapart.com, Typekit or maybe WordPress, otherwise I will find you and you will feel the wrath of the pixel. Jason Santa Maria is one of those designers that you read about constantly when important stuff is debated. Also, take a look at his portfolio, you will be amazed about his artwork.

Follow Jason Santa Maria on Twitter: Jason Santa Maria

4. Veerle Pieters

Veerle Pieters seems to be the only woman in this list … that’s strange, because there are a lot of good women designers out there. But back to Veerle and her graphic design skills – any pixel she puts on the screen is mind-blowing and any of her portfolio samples are unique.

Follow Veerle Pieters on Twitter: Veerle Pieters

5. Matthew Smith

You may know little about Matthew Smith but I’m sure that you already are a fan of his work. You have to be … because his big blue whale is on every design gallery site – yes, I’m talking about the Squared Eye whale.

Follow Matthew Smith on Twitter: Matthew Smith

6. Elliot Jay Stocks

You may read Elliot’s description in the next image, but you have to visit site (great design and execution) and then visit his portfolio. I promise you won’t be disappointed. He is a complex designer having artworks in all design domains: print, web, identity, illustration.

Follow Elliot Jay Stocks on Twitter: Elliot Jay Stocks

7. Simon Collison

You might have heard about Responsive Design, the new hot thing in web design – adaptive design based on screen size and more. Well in case you have, you are familiar with the mother of all responsive websites – http://colly.com – Mr. Simon Collison’s website. I actually don’t want to say more and invite you to visit and discover it.

Follow Simon Collison on Twitter: Simon Collison

8. Dan Cederholm

Dan runs the small yet awesome design studio – SimpleBits, studio that brought great designs like Cork’d, Wikirank, Sphere, MTV, Odeo and even Google (2 tiny icons). What you probably are more familiar is Dan’s latest book – CSS3 for Web Designers (buy it, it is a great source for CSS3 techniques).

Follow Dan Cederholm on Twitter: Dan Cederholm

Step 1. Identifying Problems

The main goal as I said earlier was to improve the performance of the site. I had a slider, additional images, other dependencies from plugins that combined were making the site to load kinda slow. So, I started to analyze the site’s components and identify potential problems.

» Numerous Dependencies – CSS and JS files from plugins
» Unnecessary HTML and CSS code
» Extra images on the home page
» Slider – a component that consumes bandwidth and makes the site slower

Step 2. Redesigning the Site

After all elements were identified, I’ve started to analyze them and decide the ones that were suitable for the new redesign goal: performance. From this analysis a lot of elements disappeared.

» No Slider
» One main image for the featured article on the home page
» Improving performance using CSS instead of images (for gradients and shadows)

Step 3. Running Analysis Tools

After the redesigned was finished, that means of course several iterations, I’ve started to implement the design into a WordPress theme. I was very cautious to squeeze every drop of performance from different parts of the site. So after the site was completed I had the following results:

Step 4. Measuring The Impact of Speed Performance

After 2 months, I’ve decided that it would be a good idea to measure the impact the speed performance improvement had on my site. The performance is not going to be measured by the numbers of visitors, but instead we are going to analyze their behavior. So, I’ve put together side by side October vs January and I’ve noticed some changes.

» Bounce Rate: 10% improvement
» Time on Site: 25 seconds more
» Page Views: 10% improvement

Step 5. Repeat these steps from time to time

Of course that there are a lot improvements still to be made, but it is nice to see such impact of speed performance after just one month. You should also repeat the previous steps after a while, to keep your site in good shape.

It would be nice to post more often in order to benefit from these changes but for now, I’m glad for current results. Cheers!

3D Content Creation Software

I will start with 3D applications dedicated to game and movie industry and not only. These application are awesome tools that can transform simple sketches and ideas into awesome experiences. You can see the results of this kind of tool everywhere on the web in the form of renderings, games, characheters, movies etc.

1. Autodesk 3ds Max

Autodesk 3ds Max is the most popular 3D application. It has a great community and it requires relatively small amount of time to learn it on a basic level. This is possible due to the huge number of tutorials available on the web. It is the leading application in the game industry but it is also a great package for the movie and media industry.

To sustain all the buzz around it are the movies and games that were created using Autodesk 3ds Max. Spider-Man 3, Hellboy, The Dat After Tomorrow, The Matrix Reloaded, The Mummy, X-Men Trilogy, I, Robot or games like Assassin’s Creed (photo), Tony Hawk’s Project 8, Gears of War and many others.

2. Autodesk Maya

Autodesk Maya is “the” choice for creating impressive visual effects for the movie industry. This statement can be easily confirmed by the movie titles that were relying on Autodesk Maya: Transformers, Transformers: Revenge of the Fallen (photo), The Golden Compass, Monsters and Aliens, Star Trek, The Chronicles of Narnia: The Lion, the Witch, and the Wardrobe, Stardust, Ice Age.

3. Autodesk Softimage

Formerly known as Softimage|XSI and owned by Avid Technology, Autodesk Softimage is one of the top players in the 3D content creation category. Used in media, movies and games industry, Autodesk Softimage has gained a great reputation mainly in the game development area. With games like Crysis, Half-Life 2, Hitman, Lost Planet, Metal Gear Solid 4 and movies like 300, Sin City and Transformers it is quite easy to understand why Softimage is a great pick for numerous studios.

4. Newtek Lightwave 3D

Now that Autodesk has 3 top products, Newtek Lightwave 3D may seem the only real competitor. It is hard to compete but the great tools and power behind Lightwave 3D make this application a great choice in the movie and media industry. Just looking over its portfolio you can realize what kind a product it is: The Dark Knight, Eagle Eye, Hancock, Jumper, Iron Man (photo), Armageddon, The Matrix Revolutions, Pirates of the Caribbean: The Curse of the Black, Pirates of the Carribean: At World’s End, 300 and many others.

5. Maxon Cinema 4D

Cinema 4D from Maxon is somehow a smaller player in the 3d content creation applications compared to the previous names. But that doesn’t make it an outsider from the set of features perspective. Looking at its legacy we can say that the application has great potential: Van Helsing, Open Season, Polar Express (photo), King Arthur, Beowulf, Surf’s up and others.

6. Blender 3D

Blender 3D is the first open source solution with awesome capabilities and great community. It is the most downloaded 3D application and because it has nice features it was addopted pretty fast by the 3D enthusiasts. From game engine to advanced movie editing capabilities, this free tool will help you transform your ideas into 3D generated content. There are several movies and games based on Blender 3D: Big Buck Bunny, Elephants Dream, Yo Frankie!, Sintel and other indie productions.

Blender is a great program for people just starting out with digital art as the money saved by using this free option can be used on graphic tablets and other tools to help learn the medium.

7. Daz3D Carrara 3D

Carrara is a general purpose 3D figure posing, modeling, landscape design, rigid and soft-body dynamics, animation and rendering all within a single application. Carrara features a full set of modeling and animation tools, compatibility with Poser and DAZ format 3D figures, along with a selection of landscape generation tools at a price that is extremely competitive with rival packages.

8. Microsoft TrueSpace

About a year ago, this package was entitled Caligary TrueSpace and it was one of the smaller competitors from this domain. Then it was purchased by Microsoft and now the full commercial application is offered free in order to boost the interest for this tool. Just head to TrueSpace’s home page and you can download the entire application, as well as tutorials and documentation.

9. SideFx Houdini

Houdini is a high-end 3D animation package developed by Side Effects Software. It covers all areas: Modeling, Metaballs, Animation, Particles, Dynamics, Lighting, Rendering, Volumetrics, Compositing, Plugin Development – development libraries for user extensibility. With all these features included, Houdini comes in 2 versions with a pretty solid price: $2000 for the Houdini Escape and $6700 for Houdini Master.

In the end…

From open source application (blender) to high-end packages, these applications will serve you well in your tasks. It really depends the type of task you want to accomplish and … your budget as well. Hopefully this article will help you, and make sure to check with as soon, for in the next post we will cover 3d sculpting applications.

Cheers!

Thank you all for all your tweets, retweets and involvement.
Soon we will have other similar contests.
Cheers!

CSS3 Explained by Dan Cederholm

In his book, Dan explains some of the most interesting CSS3 features: advanced selectors, gradients, shadows or full-blown animations. So instead of going through all CSS3 documentation, you can easily read this valuable book and get the essentials.

Contents:
- Using CSS3 Today
- Understanding CSS Transitions (Read an excerpt from this chapter!)
- Hover-Crafting with CSS3
- Transforming the Message
- Multiple Backgrounds
- Enriching Forms

How to Win?

In order to win a copy of this new awesome book, all you have to do is tweet about it and in the end, add the hashtag #CSS3GR and a short url that links to this article on Twitter.
If you don’t win, you should buy the book because of its valuable information. Also make sure to check from time to time new appearances from A Book Apart.

The winner will be randomly decided on November 24th. Good luck to you all.

BlackBerry

Apart from the fact that BlackBerry’s slider content is outstanding and very creative, it also takes the main part of the site making the slider the most important part on the homepage.

Palm

Palm takes the slider component and uses it in a slightly different manner. Instead of being the main focus on the front page, Palm has a smaller vertical slider that is more subtle than the one from BlackBerry.

HTC

You can see a big resemblance between HTC and BlackBerry. HTC uses the slider as the main component on the same page though the style is more clean and with a sketchy touch.

HP

HP takes the content slider a little bit further compared to previous sliders. Apart from the usual navigation, HP adds a play, previous and next buttons and makes the slider static in the first place.

Lenovo

Lenovo is another company that has a big slider on the first page as well. Actually almost all big players from the PC domain have and on Lenovo’s site you can see a simple one with a simple numbers based navigation.

Acer

Compared to Lenovo, Acer has its main page deigned as a big slider with thumbnails position in the bottom right side for navigation. From this selection of sliders it is the one with the strongest presence.

Microsoft

We can’t have this showcase without mentioning Microsoft. On its first page Microsoft has a slider like a horizontal accordion. It is a different approach compared with the rest sliders, it shows the content clearly and I assume it drives good conversion since it is on Microsoft website for quite some time.

IBM

I actually can’t remember IBM’s site without a slider. I think that is because IBM had few updates on the design and that a slider was involved in one way or another. Anyway, the slider looks great because it always has great images and a simple fade+slide in effect for text.

Oracle

What ca we say about Oracle’s slider. Not much actually … it is simple, powered by great images and it has a simple navigation placed in the top right side.

SAP

SAP, Oracle’s biggest competitor has a slider too. The difference is that the navigation is based on thumbnails, in this case faces of important people.

Nvidia

Nvidia relies heavily on the slider to notice the user about latest events and products. Its slides are often small videos that enhance the importance of the slider.

ATI

AMD/ATI has a different opinion on how to use a slider. On their site, you can find 2 smaller sliders – one to promote technologies and another to showcase products.

Intel

Now that we’ve covered AMD, we must cover Intel. And Intel has a slider too, but bigger (no wonder), with blue based images in order to emphasize Intel brand.

AOL

A different segment where content sliders are often used is the segment of portals. And AOL is one of the top portals with a small slider in the center of the page that showcases the most important news.

MSN

MSN falls in the same category as AOL and it has a slider with the same functionality as AOL. But you will notice that MSN has a much more cleaner approach.

NewEgg

The last 2 examples are from e-commerce sites. The first one is NewEgg a great site for electronics that uses the slider component at a lower scale compared to early showcased sites. The main purpose of the slider is to present the latest promotions.

Target

The last item on our list is Target.com. Compared to NewEgg, its slider has a different approach, covering a lot of space but promoting general stuff rather than specific.

As you can see, slider components are widely spread and also are becoming popular. From blogs to corporate websites we find these components scattered across the web. Let us know what you think about this component or other great samples of sliders.

Cheers!