a picture appearing as an element in a UI. Usually photographic rather than a drawn representation.
15
votes
5answers
439 views
Which is more likely to be read and processed: (related) text placed above or below an image/video?
I'm thinking about layout on pages where the main asset is visual — for instance, a photo of an item from the collection on a museum website, or embedded video as on YouTube and many news sites. ...
14
votes
3answers
485 views
Bad picture, or no picture at all?
I am currently rebuilding an e-commerce website from scratch. The design that has been created for the new site features a lot of large images, which looks pretty good. However: not all pictures in ...
14
votes
5answers
567 views
UX impact of standard stock photos
It's pretty clear to me that standard stock images (examples 1 / examples 2) don't help to build a brand or identity. Are there any studies about the impact of stock images? Any other thoughts?
In ...
14
votes
5answers
436 views
How detailed should a text alternative version of an image be?
Had a debate with a collegue recently about a accessible text alternative to an infographic we have. When they wrote the text alternative they wrote in detail exactly what was going on in the picture ...
13
votes
3answers
362 views
Do people find someone in a list faster by name or a profile picture of the person?
I am looking for research to find out if when looking through a list such as a team list in a project management app people find it easier to find someone by their profile picture or their name?
I am ...
13
votes
5answers
473 views
How to indicate that an image is a link too?
I have a section in my website called "Techonology" that is not part of the main content where I put the logos of each technology used in the website (PHP, MySQL, Bootstrap, etc). But I'm searching ...
10
votes
2answers
227 views
Caption below or above image for navigation purposes?
It was already discussed here that for layout purposes, where images and video appear on a web page, ordinary captions are probably best placed below the graphic — largely due to convention.
I want ...
9
votes
2answers
312 views
Best way to show user image is being process by the server
I have an App that takes images from the users for a beauty competition.
I use Amazon EC2 to process the images and SQS to queue images being processed.
Right after the user upload when they go to ...
9
votes
2answers
318 views
Should images be given alt text if they contain no information?
Example: a biography page with a picture of the person. The image contains no useful information, yet it adds enough emotional value to the page that simply removing it is not the solution.
If you ...
9
votes
5answers
198 views
Using a back panel image as navigation
I wanted to get some opinions and feedback on using an image of a back panel for navigation. In our current UI we have a setup of a appliance. The appliance has a number of ports and some need to be ...
9
votes
4answers
120 views
Best Approach for Responsive Linked Images from Desktop to Mobile?
I am redesigning a website from the early 90's and trying to make it more "responsive". An issue came up that involves two images on the homepage when viewed on mobile devices. These images are linked ...
8
votes
3answers
510 views
Using country flags with currencies?
We are considering incorporating national flags into a currency selector, alongside ISO currency codes, like this:
We are well aware we should not use flags for selecting languages because there ...
7
votes
8answers
535 views
How to visually suggest to the viewer that there is more than meets the eye in a elegant, neat looking way?
From a user experience design point of view, what would be a good way to let the viewer know, or better said, I want the user to "get it as he sees it" without further explanation that what I am ...
7
votes
8answers
1k views
Is 10 search results per page the best?
When there are a lot of search results they often are paginated. Most search engines I know show 10 results per page. I guess this was born out of an easy technical solution or habit. But I don't know ...
7
votes
3answers
142 views
How to best deal with many thumbnails in a product image gallery
We have an image gallery with thumbnails that can be clicked to reveal a larger version of them in a viewport.
Here are some conditions that the layout needs to meet:
The Gallery has to cater to ...
7
votes
7answers
316 views
What websites present artwork well? [closed]
I was wondering if anyone had seen some exceptionally good layout design in presenting a variety of paintings. My go-to resource so far has been the MOMA, but they are a little cluttered for my taste.
...
7
votes
3answers
206 views
Using stock imagery with sensitive subjects
Something I've always wondered about is what effect would bad stock photography have on the user for sensitive subjects. I'm talking cheap, literal and cliche. I personally find this type of thing ...
6
votes
4answers
330 views
Should we keep image popup after page refresh?
Simple scenario: User visits site and clicks on small image to enlarge it - large image opens in popup with transluscent dark overlay.
When user refreshes the page or shares the link, should the ...
6
votes
3answers
3k views
What's a good icon/paradigm for a “show/hide” toggle button image? [closed]
I need to give an option to show or hide certain detail. What's a good pair of icons for "show/hide"?
Sorry, let me clarify. I am going to use it in a MS Office Ribbon style navbar at the top. The ...
6
votes
2answers
674 views
Modifying images for mobile sites: scale them or cut them?
This is the first time I design a website that has a mobile version.
This is the original size of the images (well, they are a little bit bigger):
This is the size when they are displayed in ...
6
votes
2answers
166 views
What menu strip items and other controls deserve their own icon?
I'm creating an application which has buttons and menu strips everywhere. I have icons for nearly object (from icons to menu strips). The problem is, I want my application to be professional and ...
6
votes
4answers
272 views
How big should an image be on a computer for you to clearly see someone's face?
I have a website where people need to be able to clearly see each other. What is the smallest that say, a PNG, could be, while allowing the viewer to clearly see the features of a face?
6
votes
2answers
331 views
Panoramic images in a web context: good user experience examples? [closed]
I often create ultra-wide images on my iPhone (stitched together with Pano.app), and I'm looking for user experience examples to display them on a website. These are not spherical or 360º images ...
5
votes
5answers
707 views
Are these religious icons clear enough without supplementary labels?
Given this UI (in HTML), do I need to put texts beneath the large images, or is the small image displayed in the lists enough to make the connection?
Conclusion
The client has signed off on the ...
5
votes
6answers
434 views
Are higher-resolution images always better?
I have had this perception that for a given size, higher resolution pictures will always look better than the lower ones.
But on this link in StackOverFlow I read something different.
So my ...
5
votes
3answers
420 views
Should the image popup be closed when clicking on image?
It is obvious that we close popup when we click on dark area, on close button, or press escape key. But should we close it when we click on center image?
Let's assume that there are three scenarios, ...
5
votes
10answers
863 views
Multitouch gesture Interaction: Beyond the pinches and swipes.
A mixed bag of interaction and expectation...
You are using the photo app on the iP(hone/od/ad) you know there are a few familiar gestures to interact.
Tap to select an image.
Swipe left or right ...
5
votes
2answers
117 views
How do we design elements that feature unpredictably sized images?
There are contexts where a design needs to represent several items, each with inconsistently sized images. One example might be a customer database, where the customer's logo is an identifying ...
5
votes
2answers
344 views
Handling images larger than viewport in carousel-based gallery
I'm trying to figure out the best way to design an image gallery embedded in a lightbox. The gallery has thumbnail versions of each image in a carousel, and clicking a thumbnail brings that image ...
5
votes
2answers
214 views
A modern image gallery: fluid or elastic?
I am new to UX and IA and everything about interface and solution design. I need to do a simple image gallery based on grids. I read about responsive design and media queries.
Ok, in wide screen i ...
5
votes
2answers
135 views
Image Search results: to crop or not to crop?
I'm currently working on a search engine displaying image results. We are currently stuck on choosing the best way to display image thumbnails.
On mobile, major search engines (Google, Bing) tend to ...
5
votes
4answers
180 views
Radio button groups with thumbnails
Please advise which of the following approaches is more usable:
Switching images, all captions are visible:
All images and captions are visible:
Swithing captions, all images are visible:
4
votes
3answers
445 views
Best icon to represent transparency? [closed]
What would be the best image/icon to represent transparency?
It should be as compact as possible and fit in a 13x11 area.
I see that I should add more information.
I need this image/icon to be ...
4
votes
2answers
395 views
Why do some patterns flicker in strange colors while scrolling? [closed]
This image (source: Guardian Business) exhibits strange behavior when scrolling on some browsers. At 100% in Safari (on OS X on an LCD display), it flickers red when scrolling; at some zoom levels it ...
4
votes
3answers
192 views
What is a suitable interface for exploring big images?
With the infographics fever there are a lot of big resolution images around the web. Usually, the designers are constrained to create them using long vertical formats otherwise it would be too ...
4
votes
3answers
158 views
Product image links
The scenario: customer navigates to the start page of a e-commerce book site, is presented with various offers on new books. Books is shown just by its fairly large cover.
Example: ...
4
votes
4answers
125 views
In a blog article, how to subtly hint that some of the images link to bigger versions?
I published an article on the Cooking.stackexchange blog yesterday. I shot all photographs in a standard 3:2 side ratio, but when I inserted them whole, I didn't like the appearance. I asked for help ...
4
votes
1answer
122 views
Screen resolution causing wave effect in background image
I'm in the process of developing a website that is reminiscent of an old CRT monitor. To achieve the effect, I've taken an image that consists of a horizontal black line and a white line repeating ...
4
votes
5answers
127 views
Best Practice for video start image
Should a video player (on load / idle mode) always only show a still picture that was 'grabbed' from the video? Or would it be ok-practice or even better-practice to show a photo, that is somehow ...
4
votes
3answers
110 views
Interface for image editor app with many tools for small touchscreens?
I'm making an image editor app for phones with touchscreens. It will have tools that are similar to related desktop applications like brush, pencil, rubber, mask, smudge, crop, text etc. tools.
For a ...
4
votes
2answers
70 views
How to place text and a gallery side by side without giving more relevance to one or the other?
I have some galleries and some text (2 o 3 word pages) attached to each gallery. Until now I've had a gallery and the text in two different pages, with a link bar to switch between one and the other. ...
3
votes
4answers
872 views
Need smallest possible images for iPad that can zoom to 200% without losing quality
right now I'm using 2048x1546 images at 132dpi, PNG files. they look amazing but they are huge in file size.
any tips on how to get around having such large images in both dimensions and file size? ...
3
votes
2answers
364 views
Can poor image quality have a negative effect on user experience even though it improves the website's performance?
Can poor image quality have a negative effect on user experience though it improves the website's performance?
We use 3 type of images on our website:
Icons, logo, bullets
Stock photos like real ...
3
votes
1answer
136 views
Allowing image upload vs linking images
So, I'm developing a forum and I'd like to allow people to attach images to their posts (1 image per post) if they want. Now, I could do this the way Facebook does, that is, if there is a URL in the ...
3
votes
3answers
135 views
Dynamically Resize Pictures
I have a set of different sized images of products that I want to display on my web page with four to a row. The issue is that because they are different sizes, I don't know how to display them ...
3
votes
2answers
119 views
Displaying multiple large images at a time
I'm developing a desktop application which will show details of various types of aircraft. Previously, the application looked like this:
When the user mouses over the image in the top right, arrows ...
2
votes
5answers
699 views
Is it better to rasterize text into a header image or overlay it as text?
If you want to have a fixed header on a web page that also includes text, is it better to make that text part of the image, or to overlay the text in the header frame (such that the text is ...
2
votes
2answers
769 views
What is the best way to center images in websites? [closed]
Every time I work on a new project I do not have any problems to center the text using "text-align: center" to center the text, but I have never seen a similar code to center images so I always have ...
2
votes
3answers
622 views
Icon for “show image in lightbox” button (pictogram style) [closed]
The context is an image properties dialog in a CMS backend. Here the backend user has the option to let the website visitor see (a full-size version of the) image in a lightbox when clicking it.
...
2
votes
3answers
66 views
How important is it to show profile picture of a person in the header?
More and more social platforms have your name, after login, in the top right corner next to an arrow or icon where one can access settings, log out and other items.
In many cases I also see the usage ...
