Introduction¶
In the DSH workflow, to hand a UI screenshot to a pure text DeepSeek model to reconstruct a responsive Web interface, you need to first supplement layout, visual details, interaction, and browser verification constraints. dsh-ui-spec is a DeepSeek Harness plugin maintained by yumimanji, used to convert UI screenshots into implementation-oriented structured specifications.
Plugin Positioning¶
- Package name:
dsh-ui-spec - Maintainer:
yumimanji - Version:
0.1.1 - License:
MIT - GitHub:
https://github.com/yumimanji/dsh-ui-spec
Core Capabilities¶
Below are the verified capabilities to help determine if it is suitable for the current task:
- Convert UI screenshots into implementation-oriented structured specifications.
- Help pure text DeepSeek models reconstruct responsive Web interfaces.
- Use Windows native OCR.
- Provide layout, visual details, interaction, and browser verification constraints.
- Use OCR, deterministic geometry, scene graph, assets, and rendering comparison.
Installation and Enablement¶
Installing from npm¶
First confirm the DSH profile to be installed, then execute the npm install command. Here we use the web profile as an example:
dsh plugin --profile web add dsh-ui-spec
Dependencies and Package Information¶
Before installation, you can check the key dependencies in package.json. The dependency information confirmed in the documentation is as follows:
@deepseek-ai/cordis >=0.1.0-rc
@deepseek-ai/dsh-tools >=0.1.0-rc
These two peerDependencies are marked as required dependencies in the documentation.
In addition, package.json dependencies contain:
sharp ^0.35.3
package.json also declares the DSH bundle patch file as:
./cordis.patch.yml
Installing from GitHub Current Version¶
If installing from the GitHub current version and using pnpm 11, you need to allow the repository’s build script in the DSH profile’s pnpm-workspace.yaml. First, modify the profile’s pnpm-workspace.yaml:
allowBuilds:
"dsh-ui-spec@git+https://github.com/yumimanji/dsh-ui-spec.git": true
Then execute the GitHub installation command:
dsh plugin --profile web add github:yumimanji/dsh-ui-spec
If the DSH profile cannot configure allowBuilds, it is recommended to use the npm release.
Handling ERR_PNPM_UNEXPECTED_STORE¶
When ERR_PNPM_UNEXPECTED_STORE occurs, the handling method in the documentation is to rebuild the dependencies of this DSH profile and retry the installation. You can handle it according to the following steps:
cd $env:USERPROFILE\.dsh\profiles\web
Rename-Item node_modules node_modules.store-mismatch-backup
pnpm install
dsh plugin --profile web add dsh-ui-spec
After DSH starts normally, delete the backup directory.
Typical Usage¶
Make a request to the model in DSH. The following two examples are from the README.
Analyzing two images in the current directory¶
This example requires analyzing two images in the current directory, implementing them, using manage_ui_browser to validate the page, and only closing the browser session created by that tool.
Use ui-spec to analyze the two images in the current directory and recreate them as responsive web interfaces. After implementation, validate the pages with manage_ui_browser and close only the browser session created by that tool.
Analyzing a single image at a specified path¶
If you only need to analyze a reference image, you can provide a specific path. Here is a Windows path example:
Use ui-spec to analyze C:\path\to\reference.png and implement the responsive web UI.
Applicable Scenarios and Notes¶
Suitable for scenarios where there are existing UI screenshots and you want to first generate implementation-oriented structured specifications, and then let DeepSeek implement the responsive Web interface. The README points out that this plugin uses Windows native OCR, so you need to comply with this runtime condition when using it.
Before installation, you need to check the source code and license. The plugin runs with the current dsh process permissions, so do not interpret its installation method as an official app store.
Conclusion¶
The value of dsh-ui-spec lies in organizing the layout, visual details, interaction, and verification requirements in the screenshot into structured specifications, providing constraints for pure text DeepSeek models to implement responsive Web interfaces.
The currently verified materials do not provide a directory page URL, so only the GitHub link is provided here: https://github.com/yumimanji/dsh-ui-spec