Marketing is definitely a terribly powerful tool in this day and age of advertising. Just take a look at the fight between Samsung and Apple, Coke and Pepsi, GoDaddy and themselves, or Google. It works though, so when I went to UXPin.com I was intrigued to read on their site that their product is “Used by UX professionals working at these small, obscure companies:” such as Google, Yahoo!, Salesforce, IBM, Threadless, and Sony; if these corporations are using this as a solution then I would be curious to learn what exactly they use it for. Collaboration, which makes this app intriguing, is a great part of every good application now, but the trend I see seems to be that this add-on comes at a huge cost which translates itself into a user experience that I would describe as “over-designed”.
How do you solve the problem of creating a user experience for user experience designers? UXPin tries by giving you a large list of pre-built elements that you can change some attributes of but are really just supposed to drag and drop them where you think they should go on the page. Once the figure is on the page there is a box that pops up that contains the settings for that element. Once your layout is completed you can then copy all of those elements to another breakpoint and redo them all for that new layout using a background that is now the width of the device you are designing for. Here is where we encounter the first hiccup. I do not redo the layout for each element when I’m writing CSS; if I did I would have about 10 different completely separate stylesheets. I just change a few widths and floats here and there, hide a few images or sprites that are not needed or remove them from the DOM if it is a heavy site, and keep going. You won’t want to use the HTML that you download when you are done however, so really only use this application as a playground to show your developers what you want them to do. What is especially interesting is that since they do not position elements like the web does and they are making duplicates for every device, they actually have a “Smart Element” feature that allows you to create an element that can be edited on its own so it updates across all of the breakpoints. This seems like a solution to a problem that could have been avoided very early on.
Positioning elements is a breeze though, since there is some rudimentary snapping to alignment that happens. Every element becomes absolutely positioned, so you are basically thumbtacking elements to the dot board in the background, then just shifting the element around when as you need. Images are able to be inserted, but for some reason there is not an option for a background image for the body of the document. To resize an element just click a corner and drag; to preserve aspect ratio you can shift+click like in Photoshop. All of these basics are executed well, and the dot pattern every 10 pixels in the background comes in handy.
The problem with this app is that there is not any way to use it in the future. There is a list of tools, and that becomes your creative sandbox. There also is no realism to the wireframe that you create, since probably have your own buttons, logo, and site design. On top of it all, even if you wanted to use the code you create then you would have to sort through the mess of HTML you receive at the end. This application plants itself right in the middle of ease of use and usefulness, and the compromises it assumes you are willing to make are not ones you will be satisfied with.