{"id":20409165,"url":"https://github.com/tcorral/html-to-wireframe","last_synced_at":"2025-04-12T15:41:19.215Z","repository":{"id":141831543,"uuid":"41808379","full_name":"tcorral/html-to-wireframe","owner":"tcorral","description":"Tool to generate wireframes from an url or html file with different sizes.","archived":false,"fork":false,"pushed_at":"2015-09-03T07:38:43.000Z","size":168,"stargazers_count":18,"open_issues_count":1,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-22T18:02:52.083Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tcorral.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-09-02T15:10:13.000Z","updated_at":"2025-02-11T13:11:34.000Z","dependencies_parsed_at":"2023-03-13T10:28:41.541Z","dependency_job_id":null,"html_url":"https://github.com/tcorral/html-to-wireframe","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tcorral%2Fhtml-to-wireframe","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tcorral%2Fhtml-to-wireframe/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tcorral%2Fhtml-to-wireframe/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tcorral%2Fhtml-to-wireframe/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tcorral","download_url":"https://codeload.github.com/tcorral/html-to-wireframe/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248590830,"owners_count":21129893,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-15T05:39:55.275Z","updated_at":"2025-04-12T15:41:19.190Z","avatar_url":"https://github.com/tcorral.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# html-to-wireframe\nhtml-to-wireframe was created as a easy-to-use tool to generate wireframes from local or remote html files to do \nsomething like Facebook does so that the user can see the structure of your app before load the whole page.\n\nThis tool relays on:\n* Wirify Bookmarklet -\u003e http://www.wirify.com/\n* PhantomJS -\u003e https://www.npmjs.com/package/phantomjs\n* CasperJS -\u003e https://www.npmjs.com/package/casperjs\n\nTo fetch all the viewport sizes available it also uses the JSON version of the database that you can find in:\n* Viewportsizes.com -\u003e http://viewportsizes.com\n\nThe tool will generate a png image per each viewport size in 'lib/viewports/index.js' file in portrait and landscape \nso you will get two images per device.\n\n## Installation\n\n### Git\n\n```bash\n$ git clone https://github.com/tcorral/html-to-wireframe.git\n```\n\n### Node \n\nDependencies:\n\n* node \u003e= 0.10\n* npm \u003e= 2.0.0\n\n```bash\n$ cd html-to-wireframe\n$ npm install\n```\n\n## Usage\nThe usage is very simple, html-to-wireframe uses npm to running it, just execute the following code and wait to get \nyour wireframes in the screenshots folder.\n\n```bash\n$ npm start --urls=http://url.com,http://other-url.com\n```\n\n## Todo\n* Convert this tool to a command line tool\n* Convert this tool to be a npm module.\n* Add arguments to:\n** Only get a set of viewports\n** Change the path to save the images.\n** Change the name or prefix the image files.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftcorral%2Fhtml-to-wireframe","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftcorral%2Fhtml-to-wireframe","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftcorral%2Fhtml-to-wireframe/lists"}