Monthly Shaarli
July, 2014
A free, lightweight custom fields plugin for WordPress
Readability Test Tool provides a quick and easy way to test the readability of your work. It is the most flexible readability software for assessing readability formulas.
You can test all, or part of a web page, or simply type in your text. Link directly from your page - it will compute the results for the referring page.
Post Category Filter allows you to filter through your post categories and custom taxonomies by adding a search box on top of the term lists. The lists will update live as you type with only the relevant results based on your search query.
ArchView can open archive file online without downloading the whole archive. Just like normal web pages. It is very fast since it merely fetches a small portion of the archive file from server. ArchView supports RAR, ZIP formats and ISO CD image; HTTP, FTP and file: protocols. And it can present XUL or HTML interface.
Old version here https://addons.mozilla.org/en-US/firefox/addon/archview/?src=search
A quick tool for creating HTML tables out of spreadsheet data
Pete R. introduced his One Page Scroll to the world a few weeks ago. He did a great job on replicating the one page scrolling effect used on the new Apple iPhone 5S/5C websites. Today I want to show you how these animations were created in a more detailed breakdown.
Retrieve paginated link for archive post pages. Technically, the function can be used to create paginated link list for any area ( e.g.: « Prev 1 … 3 4 5 6 7 … 9 Next » )
EXPERIENCE WHAT IT’S LIKE TO LIVE FOR LIVE
Gumby 2 is an amazing responsive CSS Framework. Websites built today must be mobile friendly in order to survive. Why have two different sites for mobile and desktop when you can have your main site be one size fits all? Gumby Framework is also incredibly customizable; it’s as easy as download, tweak, deploy!
Create and configure lightweight, reproducible, and portable development environments.
Your daily dose of web design detail inspiration.
Before I came up with the interactive placeholder, I was just using a normal one. I liked the simplicity of using a placeholder as a label. It actually made a pretty crappy interaction for the user though. A user would type and the text disappeared.
Entire teams use Circle — the person who enters a value first isn’t always the same person who sees it later. To solve this problem I tried making the placeholder persist through the typing.
This worked well and made handling pre-filled data that much easier. When the <input> gets pre-filled, it behaves as it would if the user entered it themselves. Now teammates who view this in the future will know what this input is meant for right away.
Fargo is a simple idea outliner, notepad, todo list, blogging tool, project organizer.
This is the story behind Fi’s re-imagination of how news content is consumed on the web.
Unmoved by statistical analysis and provincial opinionating, Victory is concerned with the eternal glories and ignominies of players and pursuits the world over. Calling on an elite roster of like-minded contributors, Victory provides a forum for work that is unapologetically enthusiastic and uncompromisingly personal. It encompasses oral histories and personal essays, photographs and illustrations, films and animations, embracing story-telling methods both classic and not-yet-invented. Victory speaks to an audience that like its architects can distinguish the enduring from the fleeting and is ruled, above all, by an irrepressible curiosity.
Does Animation helps build richer, more vivid, and more understandable visualizations, or simply confuse things?
In this paper, we describe an empirical investigation of the utility of several perceptual properties of motion in information-dense displays applied to notification. Notification relates to awareness and how dynamic information is communicated from the system to the user. Key to a notification technique is how easily the notification is detected and identified. Our initial studies show that icons with simple motions, termed moticons, are effective coding techniques for notification and in fact are often better detected and identified than colour and shape codes, especially in the periphery. A subsequent experiment compared the detection and distraction effects of different motion types in several task conditions. Our results reveal how different attributes of motion contribute to detection, identification and distraction and provide initial guidelines on how motion codes can be designed to support awareness in information-rich interfaces while minimizing unwanted side effects of distraction and irritation.
Suspends background old tabs automatically to save memory usage.
Direct manipulation has been lauded as a good form of interface design, and some interfaces that have this property have been well received by users. In this article we seek a cognitive account of both the advantages and disadvantages of direct manipulation interfaces. We identify two underlying phenomena that give rise to the feeling of directness. One deals with the information processing distance between the user's intentions and the facilities provided by the machine. Reduction of this distance makes the interface feel direct by reducing the effort required of the user to accomplish goals. The second phenomenon concerns the relation between the input and output vocabularies of the interface language. In particular, direct manipulation requires that the system provide representations of objects that behave as if they are the objects themselves. This provides the feeling of directness of manipulation.
Just as MIT pushes at the frontiers of scientific inquiry, it is the mission of the List Visual Arts Center, located on the campus of MIT, to explore challenging, intellectually inquisitive, contemporary art making in all media.
UXPin is the UX Design Platform that gets it right.
Awwwards special mention
Everything you need to turn ordinary photos and video clips into rich videos.
Socialbakers (preferred Facebook marketing developer) is a company offering monitoring and tracking tools for analysis of social networks that are used for comparing social media stats and metrics.
Packery makes your crazy & clever layout a real thing. Be clever. Get crazy.
Evaluate Drupal projects online
The Pomodoro Technique can help you power through distractions, hyper-focus, and get things done in short bursts, while taking frequent breaks to come up for air and relax. Best of all, it's easy. If you have a busy job where you're expected to produce, it's a great way to get through your tasks. via Pocket
Django, Ruby on Rails, Node.js, Laravel, Drupal—what do these platforms have that WordPress lacks? A template language.
Håkon Wium Lie is the father of CSS, the CTO of Opera, and a pioneer advocate for web standards. Earlier this year, we published his blog post, “CSS Regions Considered Harmful.” When Håkon speaks, whether we always agree or not, we listen. Today, Håkon introduces CSS Figures and argues their case.
This plugin provides alert message for duplicate post title and unique post title when adding new post.
Design, Art & Codeby Martin Pavely Draw anywhere for navigation O/P Email, Twitter, Vine, Instagram, VSCO, Google+, Designspiration,
“In my younger and more vulnerable years my father gave me some advice that I’ve been turning over in my mind ever since. ‘Whenever you feel like criticizing any one,’ he told me, ‘just remember that all the people in this world haven’t had the advantages that you’ve had. via Pocket
Wondering if you can use a given string as a variable name in JavaScript? Learn how it works, or just use this tool.
aText accelerates your typing by replacing abbreviations with frequently used phrases you define.
Lifehacker: Text expansion, also known as typing shortcuts, can save you hours of typing each day. You type a small word or combination of characters and it'll expand into full, complex sentences that you often use. We love aText because it offers so many great features and only costs $5. If you haven't yet jumped on the text expansion train, it's time.
Emotional design example
We are 6 different people, who love designing.
We are a small team, but we possess a highly skilled work force. Our
goal is to produce great work with positive energy. Let’s enjoy
creating together.
With the evolution of sound from century to century. We started to absorb the history of Music from Live Performances to High-definition sound & streaming today to create VOX — a digital music player for the future sound of Music. A player dedicated strictly for music with a content-driven design, support of HD/Lossless files & integration with the most popular streaming services. Get it now!
Meteor is a full-stack development platform that makes it easier than ever before to build real-time web applications. This tutorial will get you up and running with Meteor in no time.
Add some simple data attributes to your markup, run $.stellar().
That's all you need to get started. Scroll right to see Stellar.js in action.
I recently migrated this website from Wordpress to Github pages using Jekyll and poole. So far I am really happy with the transition. Over time, I grew to really dislike how heavy-weight Wordpress is. I dislike how WYSIWYG editors make it really hard to see what HTML is being generated and tend to bloat the code that is produced. I found the Wordpress plugin system so confusing that I was afraid to try to customize the layout of anything.
January 1976. Philadelphia Flyers v. CSKA Moscow. The Cold War. The soul of hockey at stake. Story by Dave Hollander, drawings by Stephen Halker.
Animated Navigation Icons with CSS3 Transforms
Getting ideas on demand is hard.
Niice is a tool to help you find that spark.
Launched in 1980, i-D has built a reputation for being a consistent source of inspiration for all involved in fashion culture.
It is widely accepted that there exists a region or locus of maximal resource allocation in visual perception--sometimes referred to as the spotlight of attention. We have argued that even if there is a single locus of processing, there must be multiple loci of parallel access--several places in the visual field must be indexed at once and these indexes can be used to determine where attention is allocated. We have carried out a variety of studies to support these ideas, including experiments showing that subjects can track multiple independent moving targets in a field of identical distractors, that the enhanced ability to detect changes occurring on these targets does not accrue to nontargets nor to items lying inside the convex polygon that they form (so that a zoom-lens of attention does not fit the data). We have used a visual search paradigm to show that (serial or parallel) search can be confined to a subset of indexed items and the layout of these items is of little importance. We have also studied the phenomenon known as subitizing and have shown that subitizing occurs only when items can be preattentively individuated and in those cases location precuing has little effect, compared with when counting occurs, which suggests that subitizing may be carried out by counting active indexes rather than items in the visual field. And finally we have run studies showing that a certain motion effect that is sensitive to attention can occur at multiple precued loci. We believe that this evidence suggests that there is an early preattentive stage in vision where a small number of salient items in the visual field are indexed and thereby made readily accessible for a variety of visual tasks.
Celebrating animations of interest in software user interfaces.
UX Movement is a user experience blog that shows how good and bad interface design practices affect user behavior. We believe that a clear, fast and easy-to-use interface is the greatest user experience. It’s the UX designer’s job to make this happen.
The agency worked with Tina Brown to bring The Daily Beast to life. When Vogue wanted to create its online presence the final deal was hammered out directly between Code and Theory co-founder Brandon Ralph and iconic Vogue Editor-in-Chief Anna Wintour.
If you're considering or actively building Ajax/RIA applications, you should consider the Uncanny Valley of user interface design. When you build a "desktop in the web browser"-style application, you're violating users' unwritten expectations of how a web application should look and behave. This choice may have significant negative impact on learnability, pleasantness of use, and adoption.
Achtung Mode is Germany’s directional fashion magazine. Founded 2003 in Berlin, the editorial spotlight is on what is happening creatively in Germany, Switzerland and Austria and covers fashion movements from around the world. Achtung Mode’s editorial team attends all major international fashion weeks with focus on Paris, New York, London and Milan. As Achtung is published only twice a year, a lot of what our editors, photographers, authors and stylists see during the season does not make it into the printed version which aims to be timeless. Therefore, we have rethought Achtung Mode Online to expand our coverage with runway reviews and behind-the-scenes stories which are more of the moment.
Презентация о flexbox
Remix and share web pages instantly (bookmarklet)
NationSwell is a new digital media company focused on high-quality stories about American renewal — about the new innovators, pioneers, and builders who are doing the most creative and impactful things to move America forward. We’re focused on identifying them, telling gripping stories about them, and mobilizing support behind them.
If you’re considering ECommerce options in general, and especially WordPress ECommerce in particular, you may find yourself asking whether WooCommerce or Jigoshop is the best fit for your online storefront. Maybe these are the only two ECommerce solutions you’re considering, and just maybe you’re not even interested in reading a lengthy article comparing and contrasting and delving into the minutia of what are still two very similar options. If you’re merely looking for an anonymous opinion, or just the sort of person who likes to know the ending ahead of time, well, I’ll save the suspense:
You can travel on Tube, DLR and London Overground services using an Oyster card or Oyster photocard, just add pay as you go credit or buy a Travelcard. You can also buy paper tickets for single journeys, Day Travelcards or group travel.
Order Categories and all custom taxonomies terms (hierarchically) and child terms using a Drag and Drop Sortable javascript capability.
One of my favorite updates in WordPress 3.9 was making the TinyMCE version 4.0 core. The new TinyMCE looks a look cleaner (really matches the WP dashboard) and it has some really nice added functionality. A lot of my old themes and plugins had to be updated to work with the new TinyMCE so I spent some time digging through the API and figuring some cool stuff out. Below I’ll give you some examples on how you can extend the functionality of the TinyMCE. I’m not going to walk you through all the steps or what the code means exactly (this is intended for developers) but will provide you with the exact code you can copy/paste in your theme or plugin and then tweak accordingly.
PopClip appears when you select text with your mouse on your Mac. Instantly copy & paste, and access actions like search, spelling, dictionary and over 100 more.
В любой момент времени человек может сосредоточить свое внимание только на одном предмете. Это может быть какой-то объект реального мира (например, лист бумаги) определенная область экрана или окна, а может и какой-нибудь процесс «в уме» (например, когда человек обдумывает свои действия или что-то рассчитывает).
Start your project with the Web Starter Kit and ensure you're following the Web Fundamentals guidelines out of the box.
14 основных глав и 11 пояснительных хорошо знакомят с миром Meteor и доступны даже тем, кто никогда не занимался веб разработкой. Meteor — полноценный фреймворк со своей отдельной вселенной подключаемых пакетов под названием Atmosphere, и, в некотором смысле, он содержит в себе все, что нужно для разработки. Книжка познакомит вас с понятием кода на сервере и на клиенте, расскажет про модную реактивность данных, затронет MongoDB, упомянет про особенности NoSQL в сравнении с реляционными базами данных.
After several failed attempts at getting set up with GitHub Pages, I vowed that if I ever figured out how to do it, I’d write it up. Fortunately, I did eventually figure it out, so here is my write-up.
DESPITE MANY YEARS OF ADVANCES in computer graphics hardware and software, and in human interface technologies' designs, and styles, our user interfaces are still primarily static' The purpose of this chapter is to review ways in which dynamic imagery and animation have been used in interfaces to date, and to sketch some ways in which they could be used to enrich the interfaces of the future. Our thesis is that current uses of animation at the interface have barely scratched the surface of what is possible and interesting.
The purpose of Meaningful Transitions is to illustrate the process of the interaction and the structure of the user interface. They focus on specific events, or clarifying the user's interaction by animation. All transitions are divided into six categories in order to differentiate between their application. The aim is to present a scaleable collection of existing transitions. The transitions are shown in an abstract visualization to clarify their purposes, these visualizations also contain concrete examples. A closer look at a transition offers more information on the field of use, the mental model, the consistency, the cognitive benefit, and the illusion. see more
The proliferation of information on the Internet poses a significant challenge on humans' limited attentional resources. To attract online users' attention, various kinds of animation are widely used on websites. Despite the ubiquitous use of animation, there is an inadequate understanding of its effect on attention. Focusing on flash animation, this study examines its effects on online users' performance and perceptions in both taskrelevant and task-irrelevant information search contexts by drawing on the visual search literature and two theories from cognitive psychology. In the task-relevant context, flash is applied on the search target; while in the task-irrelevant context, flash is applied on a nontarget item. The results of this study confirm that flash does attract users' attention and facilitates quicker location of the flashed target item in tightly packed screen displays. However, there is no evidence that attracting attention increases recall of the flashed item, as is generally presumed in practice, and may even decrease the overall recall. One explanation is that when users have to use their limited attentional resources on suppressing the distraction of flash, they will have less mental resources to process information. Moreover, the results suggest that processing information about an item depends not only on the attention it attracts per se, but also on the attention that other items on the same screen attract. While flashing an item may not increase the recall of that item, it can reduce the recall of other items (especially the nontarget items) on the screen. Finally, flash has negative effects on users' focused attention and attitude towards using the website. These results have implications for website interface design, online product promotion, online advertising, and multimedia training systems, among others.
Jef Raskin wrote "The Humane Interface" about the fundamental issues of interaction design for usability of any computer based system.
A summary of design rules
Разработчик пользовательских интерфейсов Stripe Майкл Виллар опубликовал в своем блоге материал, в котором рассказал о том, как команда платежного стартапа смогла улучшить юзабилити форм оплаты, добавив в них элементы анимации, и привел соответствующие примеры.
Filter & sort magical layouts
This plugin for jQuery will arrange your images to fit exactly within a container. You can define the padding between images, give the images css borders and define a target row height.
Everytown is a movement of Americans working together to end gun violence and build safer communities. Gun violence touches every town in America. For too long, change has been thwarted by the Washington gun lobby and by leaders who refuse to take common-sense steps that will save lives.
Хекслет – свободный онлайн-университет. Мы проводим бесплатные курсы по программированию и смежным дисциплинам. Видео-лекции, тесты, упражнения, домашние задания и активное сообщество студентов – все это наш с вами Хекслет.
Особенности Хекслета: активное участие преподавателей, живое общение со студентами и концентрация на практических занятиях.