diff --git a/wagtail/wagtailimages/static/wagtailimages/js/image-url-generator.js b/wagtail/wagtailimages/static/wagtailimages/js/image-url-generator.js
new file mode 100644
index 000000000..736ae6a75
--- /dev/null
+++ b/wagtail/wagtailimages/static/wagtailimages/js/image-url-generator.js
@@ -0,0 +1,19 @@
+$(function() {
+    $('.image-url-generator').each(function() {
+        var $this = $(this);
+        var $filter = $this.find('input.filter');
+        var $result = $this.find('div.result');
+
+        var generatorUrl = $this.data('generatorUrl');
+
+        $filter.keyup(function() {
+            $.getJSON(generatorUrl.replace('__filterspec__', $filter.val()))
+                .done(function(data) {
+                    $result.text(data['url']);
+                })
+                .fail(function(data) {
+                    $result.text(data.responseJSON['error']);
+                });
+        });
+    });
+});
diff --git a/wagtail/wagtailimages/templates/wagtailimages/images/_url_generator.html b/wagtail/wagtailimages/templates/wagtailimages/images/_url_generator.html
new file mode 100644
index 000000000..608eafd13
--- /dev/null
+++ b/wagtail/wagtailimages/templates/wagtailimages/images/_url_generator.html
@@ -0,0 +1,9 @@
+<div class="image-url-generator" data-generator-url="{% url 'wagtailimages_generate_url' image.id '__filterspec__' %}">
+    <h3>URL generator</h3>
+
+    Filter spec:
+    <input type="text" class="filter">
+
+    URL:
+    <div class="result"></div>
+</div>
diff --git a/wagtail/wagtailimages/templates/wagtailimages/images/edit.html b/wagtail/wagtailimages/templates/wagtailimages/images/edit.html
index f75b4e56e..e30d96aaa 100644
--- a/wagtail/wagtailimages/templates/wagtailimages/images/edit.html
+++ b/wagtail/wagtailimages/templates/wagtailimages/images/edit.html
@@ -1,5 +1,6 @@
 {% extends "wagtailadmin/base.html" %}
 {% load wagtailimages_tags %}
+{% load static compress %}
 {% load i18n %}
 {% block titletag %}{% blocktrans with title=image.title %}Editing image {{ title }}{% endblocktrans %}{% endblock %}
 {% block bodyclass %}menu-images{% endblock %}
@@ -9,6 +10,10 @@
 
 {% block extra_js %}
     {% include "wagtailadmin/shared/tag_field_js.html" %}
+
+    {% compress js %}
+        <script type="text/javascript" src="{% static 'wagtailimages/js/image-url-generator.js' %}">
+    {% endcompress %}
 {% endblock %}
 
 {% block content %}
@@ -33,7 +38,10 @@
                     <li><input type="submit" value="{% trans 'Save' %}" /><a href="{% url 'wagtailimages_delete_image' image.id %}" class="button button-secondary no">{% trans "Delete image" %}</a></li>
                 </ul>
             </form>
-            
+
+            {% if url_generator_enabled %}
+                {% include "wagtailimages/images/_url_generator.html" %}
+            {% endif %}
         </div>
         <div class="col5">
             {% image image max-800x600 %}
diff --git a/wagtail/wagtailimages/views/images.py b/wagtail/wagtailimages/views/images.py
index 9a986a810..e502ed2e6 100644
--- a/wagtail/wagtailimages/views/images.py
+++ b/wagtail/wagtailimages/views/images.py
@@ -104,17 +104,17 @@ def edit(request, image_id):
     else:
         form = ImageForm(instance=image)
 
-    # Check if frontend image serving is enabled
+    # Check if we should enable the frontend url generator
     try:
         reverse('wagtailimages_serve', args=('foo', '1', 'bar'))
-        frontend_serve_enabled = True
+        url_generator_enabled = True
     except NoReverseMatch:
-        frontend_serve_enabled = False
+        url_generator_enabled = False
 
     return render(request, "wagtailimages/images/edit.html", {
         'image': image,
         'form': form,
-        'frontend_serve_enabled': frontend_serve_enabled,
+        'url_generator_enabled': url_generator_enabled,
     })